In commercial tenants, there is an “Add to Teams” menu option to easily add a Power App to Microsoft Teams.
This “easy button” is not available in the US government clouds today (as of June 2023). This document outlines the steps to follow to add canvas app as an app in Teams that can be used by users in your tenant.
You will need necessary permissions to upload an app to your tenant. For more on the required permissions see Manage custom and side-loaded app policies and settings
This will only work for GCC tenants. As of today (June 2023), side loading apps in Teams is not supported in GCC-High, DoD or higher.
This document assumes you already have a canvas app ready to be published to Microsoft Teams. You will need the App URL located on the app’s details page.
For more on creating a canvas app, see What are canvas apps?
Before you can publish a canvas app to teams, you must “wrap” the app in a Teams app package.
A Teams app package has two components:
- App Manifest
- App Icons
You’ll need two icons
The color version of your icon displays in most Teams scenarios and must be 192x192 pixels. Your icon symbol (96x96 pixels) can be any color, but it must sit on a solid or fully transparent square background.
Teams automatically crops your icon to display a square with rounded corners in multiple scenarios and a hexagonal shape in bot scenarios. To crop the symbol without losing any detail, include 48 pixels of padding around your symbol.
An outline icon displays in two scenarios:
- When your app is in use and “hoisted” on the app bar on the left side of Teams.
- When a user pins your app's message extension.
The icon must be 32x32 pixels. It can be white with a transparent background or transparent with a white background (no other colors are permitted). The outline icon should not have any extra padding around the symbol.
For more, see App Icons
The App Manifest is a JSON file that describes how your app is configured, including its capabilities, required resources, and other important attributes.
Here is the latest schema: Manifest schema reference
Here is an example of the Manifest JSON:
{
"$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.16/MicrosoftTeams.schema.json",
"version": "1.0.0",
"manifestVersion": "1.16",
"id": "3011e0d5-51e9-4cf5-bbf6-b891ad87c96f",
"packageName": "com.package.name",
"name": {
"short": "JWR Test App",
"full": "JWR Test App for Documentation"
},
"developer": {
"name": "Microsoft Federal",
"mpnId": "",
"websiteUrl": "https://www.microsoft.com",
"privacyUrl": "https://privacy.microsoft.com/en-us/privacystatement",
"termsOfUseUrl": "https://www.microsoft.com/en-us/legal/terms-of-use"
},
"description": {
"short": "App used to help with documentation ",
"full": "This app exists to help me document the process of publishing a canvas app to Teams (when the \"Add to Teams\" button is not available)"
},
"icons": {
"outline": "outline.png",
"color": "color.png"
},
"accentColor": "#FFFFFF",
"staticTabs": [
{
"entityId": "ce251a7e-37ac-4898-afb8-ae1c64eaca25",
"name": "JWR Test App",
"contentUrl": "https://apps.gov.powerapps.us/play/e/[ENVIRONMENT GUID]/a/[APP GUID]tenantId=[TENANT GUID]",
"scopes": [
"personal"
]
},
{
"entityId": "about",
"scopes": [
"personal"
]
}
],
"validDomains": [
"apps.gov.powerapps.us"
]
}
While you can create the app package manually, we recommend using the Developer Portal app in Teams. Note: as of June 2023, the Developer Portal is listed as GCC Beta. It may or may not be available in your tenant depending on your administrator’s settings.
To get started, Add the Developer Portal (if not already installed) For more see: Add an app to Microsoft Teams
Open Developer Portal and Click + New app
Next give the app a name
Next, fill in the fields.
The following are required:
- Short Name (defaults to what you typed on the previous screen)
- Short Description
- Long Description
- Developer Information
- Website
- Privacy Policy URL
- Terms of Service URL
Then click on Branding and attach the two icons and select Accent color
Then click App features and select Personal App
Then click Create your first personal app tab
Fill in the required fields. Tip: Paste the app URL copied from Power Apps details page for Content URL and click Confirm
Then click Save
Use the built in validation tool to confirm the app is ready to be published. On the Dashboard, in Team store validation, click View details
Address any errors and warnings before downloading the package
Use the App submission checklist then click Download app package
Below are two different methods to publishing your app in Microsoft Teams.
- Option 1: "Side Loading" is useful if the app is for you or a small number of people (e.g. your team)
- Option 2: Publish to Your Org allows you to make your app available in the Teams store for your entire organization. This requires a Teams Admin approval.
If you don't have the necessary permissions to publish the app yourself, your Teams Administrator can do it from the Teams Admin center. Click here for more details: Publish a custom app by uploading an app package
Click Apps on the left rail, then click Manage your Apps, then click Upload App
Click Upload a custom app
Select Zip file Confirm details are correct and click Add
Wait a few moments and then the app should load. Note: the About tab is created automatically.
For more see Upload your custom app
If you’d like your app to be available to your entire organization, you can submit it for approval and when it’s approved, it will appear in the Built for your org section of the Teams App Store:
Click Apps and then click Upload an app
Click Submit an app to your org
Choose the Zip file If successful, you should see the following confirmation pop-up
Click View your requests to see your request and monitor it’s progress
At this point, your Teams Admin will need to approve (or reject) your app. We strongly recommend working with your Teams Admin before, during and after the upload process to ensure as smooth deployment.
For more see: User requests for admins