Expert Finder message extension sample with SSO

This sample demonstrates a Teams message extension integrated with Microsoft Copilot, enabling users to efficiently search experts with Microsoft Graph API based on their skills, location, and availability. The extension features Single Sign-On (SSO) for enhanced user experience and authentication.

繁體中文版本請參考 (Refer to the Traditional Chinese version) : README(zh-tw).md

Table of Contents

• Prerequisites
• Setup and run the sample locally
• Deploy the app to Azure
• Use the app in Teams and Copilot for Microsoft 365
• Further reading

Prerequisites

• Node.js 18.x
• Visual Studio Code
• Teams Toolkit
• An Azure account. The required resources will later built in this environment.
• A Microsoft 365 work or school account with Copilot for Microsoft 365 license and the permissions to upload custom Teams applications. If the permission is disabled, you can either use Microsoft 365 development account or contact your tenant administrator to turn on the upload custom app permission for your organization. Below are the steps to enable permission as a Teams admin:
  • When the custom app upload is disabled, the following error is displayed:
    
  • Go to the Teams admin center.
  • Navigate to Teams apps > Permission policies.
  • Click on Global (Org-wide app default).
    
  • Enable Upload custom app.
    
  • Go to Teams apps > Manage apps > Actions > Org-wide app settings.
    
  • Turn on the Upload custom apps for personal use toggle.
    

Setup and run the sample locally

1. Ensure you have installed Visual Studio Code and Teams Toolkit extension.

2. Clone the repository

   git clone https://github.com/yuting1008/expert-finder.git

3. Navigate to the expert-finder folder and open it with Visual Studio Code.

4. Select File > Open Folder in VS Code and choose this samples directory from the repo.

5. Using the extension, sign in with your Azure account and Microsoft 365 account where you have permissions to upload custom apps.
   ⮕

6. Select Debug > Start Debugging to run the app in a Teams web client. Once the debugging process starts, your default browser will open and navigate to the Teams web client, allowing you to test the application.
   

Deploy the app to Azure

1. Ensure the application is running locally to identify and resolve any potential bugs before proceeding.
2. Open the Teams Toolkit and select Provision under the Lifecycle section. This action will create the required resources in your Azure environment.
   
3. Select Deploy under the Lifecycle section. This action will deploy the base folder to Azure.
4. Select Publish under the Lifecycle section. This action will publish the application to Teams admin center.
5. Navigate to the Teams admin center and approve the app.
6. Open your Teams app store and install the app. And now you can refer the next section to use the app.
   
7. If you encounter any errors when using the app, you can check the error log on Azure App Services. Navigate to the Web App you provisioned in Azure. Click Monitoring > App Service Logs.
8. Enable Application logging (Filesystem) and click Save.
9. You will then be able to see the log of the web app in log stream.
   

If you make any changes to the source code, click Deploy again to apply the changes to the deployed app.

Use the app in Teams and Copilot for Microsoft 365

Navigate to the Microsoft Copilot for Microsoft 365 chat. Check the upper right of the chat user interface. You should see the Expert Finder as and agent. Click it and start using Expert-finder plugin.

SSO auth with consent popup when sign in button is clicked

On first use, a window requesting for Sign In pops-up and once SSO is completed, the user flow continues as usual.

Search based on skills and country in Copilot

Here are some sample prompts you can try :

1. Find experts with skill in Azure.
2. Find experts with skill in React and who are from Taipei.
3. Find experts with skill in Azure and available for interview.

Try out message extension in chat

Further reading

• Message extensions for Microsoft Copilot for Microsoft 365
• Get started with Microsoft Graph