msgext-product-support-sso-csharp

page_type	description	products	languages
sample	This sample implements a Teams message extension that can be used as a plugin for Microsoft Copilot for Microsoft 365. The message extension enables users to query the Products list in the Product support SharePoint Online team site via Microsoft Graph.	office-teams copilot-m365	csharp

Product support message extension sample

This sample implements a Microsoft Teams message extension that can be used as a plugin for Microsoft Copilot for Microsoft 365. The message extension allows users to query items in the Products list in the Product support SharePoint Online team site via Microsoft Graph. Whilst this sample uses Microsoft Graph, the approach used in this sample can be used to call any API that uses OAuth 2.0 authentication.

Prerequisites

• Visual Studio 2022 17.9+
• Teams Toolkit
• Azure subscription
• You will need a Microsoft work or school account with permissions to upload custom Teams applications. The account will also need a Microsoft Copilot for Microsoft 365 license to use the extension in Copilot.

Minimal path to awesome

1. Prepare SharePoint Online

• Using SharePoint look book service, provision a new SharePoint Online team site using the Product support template
• In the Products list, create indexes on the Title and RetailCategory columns

NOTE: If you can't use the SharePoint look book service, you can find the source files to create it manually in the SharePoint look book repository

2. Prepare and run project

• Open solution in Visual Studio
• In env\samples folder, copy the contents to the parent folder (env)
• In env folder, rename all files, removing .sample from the file names
• In env folder, open env\env.local
• Update SPO_HOSTNAME, replacing <tenantname> with the hostname of your SharePoint Online tenant
• Create a temporary public dev tunnel
• Run Prepare Teams apps dependencies and follow the prompts

NOTE: When Teams Toolkit prepares the app it will provision a new Azure AI Bot Service into the resource group which uses the F0 SKU which grants unlimited messages to be sent to standard channels, this includes Microsoft Teams and Microsoft 365 channel (Outlook and Copilot) and does not incur a cost

• Press F5 and follow the prompts to launch and sideload your app into Microsoft Teams

3. Test in Copilot

• In Microsoft Teams, open the M365 Chat app
• Open the prompts flyout and enable Product support plugin
• Enter Find Contoso products aimed at individuals in the message box and press Enter
• Copilot will respond with a message saying that it cannot find any information about a Contoso products aimed at individuals in the enterprise search results
• Click Sign in to Contoso products to start the sign-in flow and consent to the permissions requested by the app
• Enter Find Contoso products aimed at individuals in the message box and send it
• Copilot will respond with a message referencing Contoso consumer products
• Hover over a reference to view an Adaptive Card with the product details. The card contains a photo and action buttons to view either view the SharePoint List Item in the Product support team site or edit the product details from within Copilot
• Select Edit, you will receive a popup which will disappear, this also results in the adaptive card disappearing. This popup is caused by a second sign-in required to get an access token for Microsoft Graph from the action handler which uses the Microsoft Teams bot channel
• Hover over a reference again and select Edit, this time you will see a form appear to update the product details
• Update the product details in the form and select Save, the card will then show the updated product details