Customize Consent Preferences

We use cookies to help you navigate efficiently and perform certain functions. You will find detailed information about all cookies under each consent category below.

The cookies that are categorized as "Necessary" are stored on your browser as they are essential for enabling the basic functionalities of the site. ... 

Always Active

Necessary cookies are required to enable the basic features of this site, such as providing secure log-in or adjusting your consent preferences. These cookies do not store any personally identifiable data.

No cookies to display.

Functional cookies help perform certain functionalities like sharing the content of the website on social media platforms, collecting feedback, and other third-party features.

No cookies to display.

Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics such as the number of visitors, bounce rate, traffic source, etc.

No cookies to display.

Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.

No cookies to display.

Advertisement cookies are used to provide visitors with customized advertisements based on the pages you visited previously and to analyze the effectiveness of the ad campaigns.

No cookies to display.

Pages Menu
TwitterRssFacebook

Posted by on Jan 31, 2019 in Development, Microsoft Teams

Teams Dev Project: Expose existing LOB apps in Teams for users to share easily with Compose Extensions

Teams Dev Project: Expose existing LOB apps in Teams for users to share easily with Compose Extensions

Every organisation has data locked up in silos. The orders database. The products database. The accounts database.

Solving anything but the simplest problem involves visiting each of these stores of knowledge and pulling out relevant information, then tying it together. This tends to involve application switching, sometimes even system switching. If you’re trying to do all this whilst also collaborating on a project, it’s really painful and it harms creativity and productivity.

Microsoft Teams is the app for modern working, with its chat-based workspace. But it’s also extensible. What does this mean? It means that you can enhance what Teams means to users in your organisation, by giving them access to data from disparate systems across your estate, right within Teams.  There are a number of different ways to do this, but one which I think is under-represented, are Compose Extensions.

Show me

The easiest way to explain how useful Compose Extensions are is to show you an example. Let’s say you have an products database, with a description of items and their stock level. This information is critical to making decisions in your organisation every day, and many conversations each day centre around specific products.

Rather than a conversation including stock codes which forces readers to go and look up exactly what the poster meant (“we’re seeing great sales of 335.335 today, anyone know why?”), wouldn’t it be better if that information could be surfaced right within the conversation. Like this:

 

 

This is a Compose Extension. Once installed, they live just under the compose window (alongside the emoji and gifs!). They are a really easy and intuitive way for users to include additional content in their messages. Users are already used to going there to add files, images and smiley faces, so they will quickly learn that this is also an easy way to add product information, or contacts, or whatever organisation-specific information you want to include.

Here’s the code

The code for the sample you saw in the video is on GitHub. Here are some things to note about it:

  • The code is based on the excellent sample code provided by Microsoft on GitHub at https://github.com/OfficeDev/BotBuilder-MicrosoftTeams. That sample gives a very complete example of all the things you can do – I have taken away everything not needed for a simple Compose Extension, hoping that in making it simpler it’s easier to see how it works.
  • If you’ve previously written any Bot Framework code, then you’ll find this very familiar. The way to think about the code is that every search that the compose extension makes is sent to your code, via the same Post method that a bot update would be (MessagesController.Post). There’s a special type of activity to denote a compose extension action (ActivityTypes.Invoke) which is of a special activity type (activity.IsComposeExtensionQuery()). This means you could actually include compose extension functionality in a bot project rather than having a separate Web App just for compose extensions.
  • In the sample code I’m creating a dummy product catalog in the Products class, generating the names, codes and stock item automatically. (hint: this is where you replace my code with an API call to your own product catalog 🙂 )
  • If you look around line 95 in the MessagesController.cs file, you can see that I’m searching my product catalog for matching product codes (Teams calls multiple times as the user types, giving me that nice, responsive Intelli-Sense type search), and then iterating through each result, building a Hero Card for each one. This lets me show a image (auto-generated but would typically come from a real product catalog) and a button to link to more information.
  • None of this code is complicated, it’s all under 150 lines of code, and the productivity effect on users is huge!
  • It’s also sample code, missing exception handling, unit tests, and other niceties. You don’t have to comment on that, I’m aware, thanks. 🙂
  • This post just has the sample code. If you need to know how to turn this into an application you can consume in Teams, look out for a series of blog posts I’m doing soon on the new Calls & Meeting API; the registration process is exactly the same.

Making the Teams App

Once you’ve written the code, in order to get it into Teams for your users, you need to create a Teams App. I’ve done posts about this before, but here are the bits specific to Compose Extensions.

When using the App Studio Manifest Editor (the only civilised way to build apps), there’s a special section for compose extensions, also called messaging extensions:

You first add your extension and specify the App ID that links to your code (just like writing a bot). Then you specify one or more Commands. These are actions that the user will take, and each one can result in your code taking different actions. For each command you specify, you provice three values: the Name, the Title and the Description. The title and description is shown to the user, the name is used in your code:

When a user searches and your code is invoked, you can look up the value of the parameter, done in line 90 of the MessagesController:

1
var searchTerm = composeExtensionQuery.Parameters.Single(p => p.Name == "Location").Value.ToString();

(my parameter for the stock code is called ‘Location’ because I was originally writing a weather app, before I changed my mind. Sue me.)

Of course, you don’t have to perform a lookup every time the user enters text like I am – if you know all your stock codes are 6 characters long then you can choose to only make an expensive API call once the parameter value is 6 characters long.

LOB Company App? Publish in the Company Store!

It’s likely that if this has been a useful post then you’re about to go and create an application that’s very useful for your organisation, but also very specific to your organisation, and it doesn’t make sense for external users to have your app and your compose extension. If that’s the case then you should definately publish to your organisation’s Company Store and not attempt to side-load your application onto every user’s client in an attempt to avoid publishing. I have a blog post on publishing your apps to the Comapany Store which you may find useful.

 

Written by Tom Morgan

Tom is a Microsoft Teams Platform developer and Microsoft MVP who has been blogging for over a decade. Find out more.
Buy the book: Building and Developing Apps & Bots for Microsoft Teams. Now available to purchase online with free updates.

0 Comments

Trackbacks/Pingbacks

  1. Microsoft Teams Development: adding things to the … More Actions menu on messages | The thoughtstuff Blog - […] see either the Microsoft documentation: Create a messaging extension in Microsoft Teams or see my Teams Dev Project: Expose existing…

Post a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Share to Microsoft Teams