Microsoft Teams integration

Adding the Webparts Directly to Teams Tabs

With the recent infrastructure update, we are now able to provide direct integration of our webparts with Microsoft Teams Tabs. This is possible due to the use of the latest SharePoint Framework infrastructure, we are now able to leverage the latest features of web parts, such as direct integration on Teams tabs. So instead of creating a special SharePoint web part page and placing the web parts on them, you can create a Teams tab directly from the web part, much easier!

The following web parts are supported in Teams:

Charts - display data in a form of a chart
Rollups - combine data from several lists within one view + show list of items coming from an external data source
List Search - search information in lists
Calendar - display color-coded calendars from multiple sources
Form - display a form to submit data to external forms (submission to SharePoint list is also possible, for example using Add item button on Rollup)

Note: you may have noticed that in the above list the Fitler webparts are not included. This is due to fact that they require another webpart to be on the same page. So they cannot be added directly but via a special webpart page.

You need to create at least one webpart profile (set of settings) for the web part you are planning to use through Ultimate Forms app.

To start this you will need to make sure you already have the latest version of Ultimate Forms Extensions version 1.3.0.0 or later.

Note: If you need to update Ultimate Forms Extensions here's the link to download it.

Download Extensions

1. Sync add-in with Teams - once you upload Infowise Ultimate Forms Extensions.sppkg file into your enterprise catalog, you click on Sync to Teams button on the File ribbon
   
2. Once the sync is complete, the web parts can be found in Teams and added to tabs
3. Go to the team you want to add web part in and click on plus button to create a new tab
   
4. Use Search or browser to choose the web part you want
   
5. Proceed through the prompt to add the tab. Once the tab is created, you can configure the web part to connect to the data.
   
6. Most web parts will request a site URL and then load the available profiles from the site. You can connect to any site within your tenant you have permissions for, not necessarily the site linked to your team.
7. You can reconfigure your tab at a later time by opening settings through the dropdown menu located within the tab header.

 

Adding the WebParts via a Modern Site Page

Ok so after reviewing the above, you realize that the Infowise Filter Webpart cannot be added directly to a Teams tab. This is becuase that webpart needs to act on another webpart to be on the same page resource as the filter webpart. This is not possible through adding directly. To get around this, we can still add a SharePoint modern site page to our teams tab. This was covered in a past blog Using Ultimate Forms in Microsoft Teams

To do this, we need to create a modern site paget page were we add both the Infowise filter webpart and the other Infowise webpart too (ie Charts or Rollup)
Once we have this modern sitepage created we can then add this to our Teams tab by the following steps. Like the following;

1. Open Teams and go to your team (under Teams in the left menu). Next, we need to add an app to display our page. On the top menu of the team, click on the plus sign on the right to open the app picker:
   
2. Choose SharePoint app here:
   
3. Next, select the SharePoint page (assuming that the current team is linked to the site where the page resides:
   
   Or just enter the page URL directly:
   
4. Now Save and your done.

• Rollups
• Calendar
• Charts
• List Search
• Filters