Microsoft 365 Community Microsoft Teams, 15 Apr 2022

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: Broadcast information to Microsoft Teams with Power Apps

Description

In this 13-minute developer-focused demo, Mohamed Ashiq Faleel shares a slick solution for posting a message - an Adaptive Card with deep link or text message, to any Teams channel (except private channel) or Teams activity feed (priority message), regardless of if you are a member of the targeted channel! Uses Bot Framework REST API from a Power Automate Cloud Flow. The Power App is connected to 2 SharePoint lists storing Teams details and sent messages. Possible additional blog posts on solution in Mohamed’s blog. This PnP Community demo is taken from the General Microsoft 365 Developer community call recorded on March 17, 2022.

Demo Presenter: Mohamed Ashiq Faleel (MVP) | @AshiqFaleel

Supporting materials:
• Article - Send Teams channel message aka proactive message using custom Teams bot and Power Automate – Part 1 | https://ashiqf.com/2022/02/28/send-an-adaptive-card-message-in-teams-aka-proactive-message-using-custom-teams-bot-and-power-automate-part-1/
• Article - Send Teams channel message aka proactive message using custom Teams bot and Power Automate – Part 2 | https://ashiqf.com/2022/03/06/send-teams-channel-message-aka-proactive-message-using-custom-teams-bot-and-power-automate-part-2/
• Documentation - Send activity feed notifications to users in Microsoft Teams | https://docs.microsoft.com/graph/teams-send-activityfeednotifications
• Documentation – Authentication with the Bot Connector API | https://docs.microsoft.com/azure/bot-service/rest-api/bot-framework-rest-connector-authentication?view=azure-bot-service-4.0

Learn more:
• Learn more about the Microsoft 365 Patterns and Practices community at: http://aka.ms/m365pnp
• Visit the Microsoft 365 Patterns and Practices community YouTube channel: https://aka.ms/m365pnp-videos

A

So, let's start with, who am I uh so I'm mohammed ashik, I'm located in stockholm, sweden and I'm a solution architect working predominantly with microsoft, 365 stack and when it comes to extending its feature, I use a jr and I'm also a microsoft mep in the business applications category. Then these are my social handles.

A

So what am I going to speak about? uh So it's a solution which I've built using powerapps so which has the capability to broadcast messages which is intended for multiple teams. uh So what this is different from? We are only having connectors in microsoft, which can we can send a message from from power automate to a team. So this one is something which will help you. If you're, not a member, uh you will be able to still uh send a message from this app. A member of the team I met.

A

This app is going to send a adaptive card in a team's channel and it's going to also send an active activity feed for priority messages. Customer activity feed. It is a completely no code solution. It is almost similar to the company communicator app, the team samples which we have got, but it has, it has got few other functionalities like reading, uh creating a group chat, etc. But this one is only, it has got the capability only to send in an adaptive card to a team, and it is a no code solution.

A

So no phone audio functions, nothing everything can be done within the power platform, so it has a power app, as I said, and it has got a power automate and also a custom teams manifest which I've created from the themes developer uh portal. So let me quickly uh show the demo so that you can. You will understand what I'm speaking about. So let me go to the app. So this is the custom map in powerapp, so I've got a sample scenario which can send message to different different stores in the world.

A

So I've created a couple of sample stores to where I have to communicate messages, I'm starting it. So I, as a communicator now I'm going to compose a message and send it across the team where I'm not actually a member right. So click on new message, so first I should be selecting the region of the store where I have to send this message: europe and then sweden, the country and the stores. So I've got three stores which is under sweden uh country.

A

I'm selecting store number two and stone number four. So I, as a communicator now selected to which uh stores I have to send, send a message and I'm clicking. Next and now I have I'm composing the message so pnp demo.

A

Podcaster and summary, let me quickly take it. Take it from a lorem epsom.

A

So the message is done and I I I as a communicator. I would like to send a push notification on the user's mobile, uh that the story is mobile, I'm so I'm selecting the priority as on and the author, you can actually change it and then say it as uh internal communication streaming, for example, I'm just leaving it leaving it with my name, and you can also add additional links to this message.

A

More info, I'm adding my blog post.

A

And you can also uh upload an image, uh it's it's! It's not. It is not a mandatory field, but if you still want to send a message, send a message with an image you can do it.

A

So I'm selecting it and now save next, uh so you you, you will see a preview on what you have uh selected to which stores you have chosen to send this message to and also you can see the preview of the actual message, the image and also the message here. We have three options: save it as draft publish later so I'm going to for this. For for this demo, I'm clicking on publish.

A

Yeah, so the message is published and in couple of uh minutes it's gonna appear on the tune, p2 teams which I've selected. So let me to make it faster. Let me quickly.

A

Do this and go to the teams.

A

Since the uh we have chosen the priority as uh on so that's to be the activity fit, so you can see now here uh there is two activity right, so the stores which I have selected is store number two and store number four. So I can also see the message here: pnp, demo, broadcaster and and also the store number four. The message is here: since the message is priority.

A

There is also an activity feed with a deep link to this uh team's conversation post and the other one here which is deep link to the other channel, and you can see here. uh I have made this uh conversation uh as a publisher posted on on the information channel. So with the solution, so you can post this adaptive card to any standard team channel except the private channel.

A

So this is the demo. Let me now quickly go look at it on how I've built it.

A

So here, as as you have seen, we have got a power app which is connected to a sharepoint uh sharepoint list, so this particular sharepoint list has got all the details about the team, so, whatever teams I have as a as a communicator or as a publisher, which I have chosen so all the deals about that particular stores or or the team it is stored in this list. For what details is it?

A

It has the group id the the team channel id the the team id etc right, so after after it is published from powerapp, it goes to a list which stores all the broadcast messages.

A

So this, whenever there is a new item in this list, a power automate gets gets triggered, which will we shall use a boss, bot rest api connector to to send that adaptive card. So we are not using an azure azure function to do this or our bot connector sdk. To do this, so we are rather doing it with the help of power automate. So once this uh rest, api is exposed to the adaptive card in the team.

A

It's it's gonna, get uh uh get the message id whatever the message id uh for that uh adaptive card message and it's gonna it's using a graph api endpoint to send the adaptive card. So that is how we are here.

A

So, let's now quickly look at the solution component, so what it has got so for the first one, as I said so, all the all the teams, all the store teams- has got uh teams app installed. uh I've, not I've not done any coding. Here. I've just went to the developer uh portal teams developer portal and created a manifest it is. It is all from the interface.

A

uh So there is, there is a bot. There are a couple of features on the teams manifest. One is a bot which is responsible for sending in the sending in the adaptive card and then second one is. It has got a feature to send in the activity feeds which you have just uh seen for priority messages and if there are actually mult different ways to install the app once it is developed, the the first way is as an owner of a team.

A

You can install it by yourself or if you want to have this as an enterprise scale, app if you're having like 5, 000 stores or or 10 000 stores. So you can install the bot this particular teams app using a graph api to all of those selected teams right and then we have got an active directory app. uh So this app, this particular app, is responsible for creating for sending the activity fee and we have got a a sharepoint couple of sharepoint online lists.

A

One is for, as I talked about in the previous slide, one one is for storing the team's information and the second one is for uh storing the actual message so and then a power app, uh which has got the interface for the communicators or for the publishers.

A

And then uh there are some certain connections which happens to this uh list and then a power automate which uses couple of uh premium, connectors, http, http, connectors to send the adaptive card and also to call the graph api.

A

So this one, I have used a power automate a premium action, but if you want to avoid avoid premium connectors, you can also go the azure logic logic app route, so here. So this is the graph api endpoint, which I've used for the activity feed and the diwali permission which I've added on that uh active directory app is team activity dot send so I've used this particular endpoint, a graph api team steam id channels right and then the message id.

A

So these are the details which has been used to send that activity feed. So let's now quickly go through the solution on a very quick manner.

A

So powerapps, as I said it has got just the interface, so nothing nothing complex, but let me quickly show the power or a minute.

A

So whenever an item is created on a sharepoint less it gets triggered. So we have an automated trigger. So here.

A

We are getting the store details, so uh whatever stores we have selected or or the publisher has selected so that that information we are, we are getting it here. We are storing that as a json and we are getting certain information like the channel id the team, id etc, and this is where we are generating the the bot access token.

A

So this particular endpoint is something once the token is generated, uh the it is valid for one whole day, 24 hours and once the bot token is generated uh which has been used to send in the adaptive card. So here this this action, so you can see the endpoint details, it is smva.trafficmanager.net, and so this particular endpoint is based on the tenant on the on the team tenant.

A

If the tenant is located in emea, it'll be it'll, be like emia right, so you can, but it also works with other locations uh right so here, so this is the body, so the the body has got the adaptive adaptive card, so I built adaptive card from the adaptive card designer uh right, so that is it, and here you can. You can see whatever token we have generated from the rest api endpoint, the token which are we, which we are adding it here right and then the message id we are.

A

We are getting the the that unique message, id of that teams, teams, conversation post and at the last we are based on the priority and if it is priority uh we are sending in the activity feed if it's not, but if you're not we're, not doing it. So this one we are generating the graph api token and we are sending it so that is it and I've got references. I've written already, two blog posts. That's gonna be two more additional blog posts.

A

If you want to just follow whatever I've just said over to you, david awesome, mohammed. Thank you very, very much.