cancel
Showing results for 
Search instead for 
Did you mean: 
Priyaranjan

Working with Adaptive Cards to send Scheduled Power Automate Notifications to Microsoft Teams

Priyaranjan_13-1647964461067.png

 

Introduction

Business Use Case

Implementation

Adaptive Card JSON

Adaptive Card

Fact Set

Testing the flow

Summary

 

Introduction

 

Adaptive Cards is a way in which Developers can exchange data and content in a common way and the JSON payload used for creating the card can be used in any device or UI Framework. In addition to that there is no programming requirements for building these cards as the structure is completely defined by JSON(JavaScript Object Notation).In addition to it, we can style the card in a standard way so that it appears consistently across different platforms.

The Official Definition of an Adaptive Card goes like:

 

“Adaptive Cards are platform-agnostic snippets of UI, authored in JSON, that apps and services can openly exchange. When delivered to a specific app, the JSON is transformed into native UI that automatically adapts to its surroundings. It helps design and integrate light-weight UI for all major platforms and frameworks.”

The Card Authors can describe their content as a simple JSON object and use it to display data or take input from end users using the card. That content can then be rendered natively inside a Host Application like Microsoft Teams, Outlook etc:

In this article we will see how we can use the Adaptive card designer to create a basic Card and send it out from Power Automate to Microsoft Teams.

Business Use Case

 

We have a SharePoint list where the daily To Do tasks are described using the below columns

Priyaranjan_0-1647964157813.png

 

Daily, we need to collate the To Do tasks for that day and intimate the end user over Teams so that the user can start off his day in a planned manner and this helps in giving a bird’s eye view of his daily plan.

 

Priyaranjan_1-1647964157817.png

 

Implementation

 

We will be using a Scheduled flow that runs daily to achieve the collation of the To do tasks at 6 AM every day.

 

Priyaranjan_2-1647964157820.png

 

Followed by that, we will be declaring 2 variables:

  • WorkLogItems : A string variable that holds the appended Key Value Pair of “WorkLogItem” and its “Description” in the format : 

    

 

{
                            "title":  "  1. NH 64 Sign Board :",
                            "value": "Fix sign board in Sector 34 in NH64"
},
{
                            "title":  "  2. Road Asphalting :",
                            "value": "Asphalting of Boulevard Road"
}

 

  • CountOfItems – Integer variable that holds the count of total work items

  

Priyaranjan_3-1647964157821.png

 

Next , we get the items from the list where Implementation date is equal to today. To achieve this we add the filter condition and check if Implementation date is “formatDateTime(utcNow(), 'yyyy-MM-dd')

 Priyaranjan_4-1647964157824.png

 

To return just the two columns which we need ie:  WorkLogItems and Description, we have created a new view called the “AdaptiveCardView” in the list and have added that in the Limit Columns by View field.

 

Next major step is to add the apply to each loop so that we can iterate through the values returned from the Get Items action. Firstly we add the increment variable action to keep a count of the total items returned from the SP list.

 

 

Priyaranjan_5-1647964157826.png

 

We will also add the compose action to create a string in the format

 

{
  “title”:<Variable:CountOfItems>.<GetItemsOutput:WorkItem>:”,
“value”:”<GetitemsOutput:Description>”
}

 

 

So that we will have a concatenated string, which when used in the Card JSON will output the below in the adaptive card

 

Priyaranjan_6-1647964157827.png

 

To concatenate the key value pair built from each item, we will append the above to the string variable within the loop so that we have an collection of {“Title”,”Value”} which will be added dynamically to the JSON.

 

Finally, we add the Post Adaptive Card in a chat or channel action that will post the card to teams. We will be adding the below parameter values to the action:

 

Post as

Flow bot

Post in

Chat with Flow bot

Recipient

<User who needs to get the card in Teams>

Adaptive Card

<JSON of the adaptive card>

 

Priyaranjan_7-1647964157832.png

 

Adaptive Card JSON

 

The adaptive card json can be designed using the Card Designer

 

Priyaranjan_8-1647964157841.png

 

Here the structure of the Adaptive Card that we have built by dragging and dropping the card elements is shown in a proper hierarchy in the Card Structure panel:

Adaptive Card

 

-------- Image(Shows the Banner)

      --------  RichTextBlock(Show the Good Morning Message)

      --------TextBlock(Show the Card Title)

      --------TextBlock(Show the Card Description)

      --------Factset(Displays key value pairs in a tabular form)

 

 

 

Priyaranjan_9-1647964157846.png

 

Fact Set

The FactSet element displays a series of title-value pairs in a tabular form as shown below which is the syntax for grouping the Title and Value

Priyaranjan_10-1647964157847.png

 

Since we had to dynamically fetch the value from multiple items in the list, we had looped through the returned items and concatenated the “WorkLogItems”,” Description” in the above format using the WorkLogItems variable. So, we can easily place that variable in the facts attribute.

 

Thus, we have completed the setting up of the flow which would look like:

 

Priyaranjan_11-1647964157850.png

 

 

Testing the flow

So, lets test the flow manually as it is scheduled to run daily. On manual testing, it will fetch the items from the list which has implementation date as today. It will loop through the items and create the json key value collection which will be used in the post adaptive card action. The adaptive card has been created and posted in the teams as below:

 

Priyaranjan_12-1647964157858.png

Summary

Thus we saw, how we can create a medium complex adaptive card by collating the data from a SharePoint List and post them on a recurring basis to a Microsoft Teams User Chat

About the Author
  • Experienced Consultant with a demonstrated history of working in the information technology and services industry. Skilled in Office 365, Azure, SharePoint Online, PowerShell, Nintex, K2, SharePoint Designer workflow automation, PowerApps, Microsoft Flow, PowerShell, Active Directory, Operating Systems, Networking, and JavaScript. Strong consulting professional with a Bachelor of Engineering (B.E.) focused in Information Technology from Mumbai University.
  • I am a Microsoft Business Applications MVP and a Senior Manager at EY. I am a technology enthusiast and problem solver. I work/speak/blog/Vlog on Microsoft technology, including Office 365, Power Apps, Power Automate, SharePoint, and Teams Etc. I am helping global clients on Power Platform adoption and empowering them with Power Platform possibilities, capabilities, and easiness. I am a leader of the Houston Power Platform User Group and Power Automate community superuser. I love traveling , exploring new places, and meeting people from different cultures.
  • Blog site: https://ganeshsanapblogs.wordpress.com/ MCT | SharePoint, Microsoft 365 and Power Platform Consultant | Contributor on SharePoint StackExchange, Techcommunity
  • Encodian Owner / Founder - Ex Microsoft Consulting Services - Architect / Developer - 20 years in SharePoint - PowerPlatform Fan
  • Founder of SKILLFUL SARDINE, a company focused on productivity and the Power Platform. You can find me on LinkedIn: https://linkedin.com/in/manueltgomes and twitter http://twitter.com/manueltgomes. I also write at https://www.manueltgomes.com, so if you want some Power Automate, SharePoint or Power Apps content I'm your guy 🙂
  • I am the Owner/Principal Architect at Don't Pa..Panic Consulting. I've been working in the information technology industry for over 30 years, and have played key roles in several enterprise SharePoint architectural design review, Intranet deployment, application development, and migration projects. I've been a Microsoft Most Valuable Professional (MVP) 15 consecutive years and am also a Microsoft Certified SharePoint Masters (MCSM) since 2013.
  • Big fan of Power Platform technologies and implemented many solutions.
  • Passionate #Programmer #SharePoint #SPFx #M365 #Power Platform| Microsoft MVP | SharePoint StackOverflow, Github, PnP contributor
  • Web site – https://kamdaryash.wordpress.com Youtube channel - https://www.youtube.com/channel/UCM149rFkLNgerSvgDVeYTZQ/