[SAP & MS Teams] 2 – Target application features

Welcome back to the blog post series about how to create your own Microsoft Teams extension using SAP BTP and Microsoft Azure. In today’s second blog post, I will provide you with an overview of the sample application, which you will set up during this series.

As explained in the first blog post (click here), this sample Microsoft Teams extension for SAP SuccessFactors will allow you to create leave requests right from within Microsoft Teams. It also provides features for managers to approve or reject leave requests. As explained in the preface, this blog post series has a special focus on those customers interested in or already using the SAP Business Technology Platform and corresponding integration services.

The series will be published in multiple editions which are structured the following.

1. Preface and scenario introduction (click here)
2. Target application features (this blog post)
   • What to expect once you implemented all blog posts
   • Samples of the Microsoft Teams extension application
3. Requirements and application architecture (click here)
4. SAP BTP subaccount configuration and test users (click here)
5. SAP SuccessFactors instance setup (click here)
6. Set up your SAP Cloud Integration instance (click here)
7. Get your Microsoft Azure settings ready (click here)
8. Deploy your Microsoft Teams extension (click here)
9. Improvement ideas and further topics (click here)

A quick reminder for your convenience – Feel free to check out the GitHub repository provided in the SAP-samples organization. Please be aware that the repository is still being updated, so make sure you’re pulling on a regular basis.

https://github.com/SAP-samples/btp-extend-workflow-cai-msteams/tree/full-scope

Today’s blog post will show you, how the Microsoft Teams extension application will look and feel, once you’ve set it up in your own test and demo landscape.

What to expect

No one likes to buy a pig in a poke, so let me give you a preview of what will be shining in your environment after accomplishing all the upcoming challenges! Let’s get started with the “installation” of the new Microsoft Teams extension app and how you can add it to your profile.

Installation

The extension application can be easily searched and installed from the Microsoft Teams App Store.

Microsoft Teams App Store

You can review the details of the extension application and then Add it to your Microsoft Teams profile by clicking the respective button.

Review and add the extension application

Once “installed”, you can start using the app to create leave requests or receive notifications triggered by SAP SuccessFactors (e.g., to approve or reject leave requests). Feel free to pin the extension to your app bar, allowing quick access.

Welcome message

The bot will greet you with a short welcome message and you’re ready to go. Already excited? Well, then, let’s see how the process of creating a leave request looks like!

Creating a leave request

There are multiple options to create a leave request now. Check out the following samples of all three different entry points (as I call them).

• Create a leave request via a Tab
• Create a leave request via a Chat Bot
• Create a leave request via a Messaging Extension

Additionally, users can create leave requests using their mobile devices! But first things first – let’s get started with the tab example and also check out what’s happening on the SAP SuccessFactors side when you’re using the extension application.

Using the tab

The following sample shows you how a leave request can be created using the tab component of your new extension application.

This tab component provides a very simple example of how tabs can be used in extension applications. Within a tab you can either load adaptive cards via the bot framework or call a static URL to render web content of your choice.

So instead of adaptive cards provided by the bot framework (like in this scenario), you can for example develop your own React application, using components of the Microsoft Fluent UI library (click here or here). Doing so will give your application a great Microsoft Teams look and feel!

Using the Chat Bot

The following sample shows how a leave request can be created using the chat bot component of the extension application.

As you can see, the chat bot makes great reuse of the adaptive cards which you’ve already seen in the first video. The bot in this sample project allows you to inject further sub-dialogues, so it can also be used for other skills besides handling leave requests.

Using the Messaging Extension

The so called messaging extension component can also be used in chats with other users, so you don’t even have to leave your current conversation. Imagine you’re in a chat with your manager and you want to create a new leave request right away. Check out the following sample to see how you could do so.

Isn’t that a cool feature? Creating a leave request in less than a minute while staying in the current chat conversation?! No idea if things could be even more simplified from an end-user perspective. Okay, so that’s it for creating a leave request. Let’s check out the notification feature next.

Notifications

Once you’ve added the extension application to your Microsoft Teams profile, this allows you to receive the following types of notifications.

• Notification once a leave request needs to be processed by you
• Notification once the status of your leave request changes (Approved, Cancelled, …)

Both notification scenarios can be seen in the following samples.

Approve or reject a leave request

In this sample you can see that Caroline immediately receives a notification, once her team member Jane sends a leave request to SAP SuccessFactors using the Microsoft Teams extension.

Once approved, the status of the adaptive card changes so Caroline cannot approve the leave request again. Furthermore, a notification is sent to Jane, providing an instant update about her manager’s decision.

Leave request updated

You can see a similar status update in the following sample, where an existing leave request is canceled within SAP SuccessFactors. This will trigger a notification to the leave request owner, informing him or her about the status change.

Do you remember? – This interoperability feature was listed as a requirement for a better adoption – making sure that actions in SAP SuccessFactors are also reflected within Microsoft Teams and not just vice versa.

Wow, that’s nice, isn’t it? But wouldn’t it be even more appealing if you could also use these features on your mobile device? Read on to find out what things look like on mobile clients!

Mobile application

In our case, the native Microsoft Teams mobile client supports two entry points provided by the extension application. The chat bot and the messaging extension.

The following sample shows you, how to create a leave request from an iOS device. Besides the familiar user interface (already seen in the desktop samples), you can also see the instant notifications on the mobile device.

Hints:

• The date picker adding an additional day (in case of clients with time zones ahead of UTC) has been fixed in the meantime. Just in case you’re wondering while watching the sample.
• Approving or rejecting leave requests is currently not possible on iOS devices. You can find the corresponding issue in GitHub (click here).

What’s next?

As you might expect, there’s a lot of stuff to come in the upcoming blog posts! In the next episode, for example, you will learn all about the architecture and important security aspects of the Microsoft Teams extension application.

Stay curious!