Me Experience in Microsoft Teams using Microsoft Graph Tookit and SPFx
Published on 09/11/2020
This blog is a short walkthrough of the sample created for the Me Experience with the Combine multiple web parts in a single tab of a personal Teams app approach
The sample covers:
- Microsoft Graph Open Extensions
- Microsoft Graph Tookit with React
- Build Microsoft Teams tab using SPFx
The finished app
Personal App for Me Experience
The sample gives you 3 tabs for a Personal App in Microsoft Teams, using mgt-react package for components
Uses Agenda, Tasks, and Get components from Microsoft Graph Tookit with React
MGT-Files are coming and can replace the custom File component used here in combination with Get to simplify things further. But we don't know when but fingers crossed 🤞🏽
Uses the custom component using GET Component in MGT and a custom template
Personal Apps in Teams do not have configuration settings as in a regular
SPFx webpart. And often we might want to configure few things.
For e.g here , the app shows me my upcoming meetings for the next 8 days, may be I want to see it for just the next 5 days then I should be able to configure this.
For this personalised configuration, we have a variety of option, you can see here Here we have used Microsoft Graph Open Extensions Right now it only has one setting, the number of days passed to the Agenda component to bring back events, but we will be upgrading this to more as the need arise.
Find full source here
The app respects themes chosen by users in
Teams, thanks to this article by Joao Mendez a lot of work was simplified for this sample , kudos to you 👏🏽