honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
sp-dev-fx-webparts/samples/react-teams-lead-dashboard
History
Hugo Bernier 253df147f4 Updated compatiblity matrix 2021-11-07 01:43:55 -04:00
..
assets Fixed issue with README.MD of react-teams-lead-dashboard sample 2021-10-06 10:58:15 +02:00
config Improved react-teams-lead-dashboard sample 2021-10-06 11:46:19 +02:00
src Updated react-teams-lead-dashboard sample 2021-10-07 11:52:29 +02:00
teams Added react-teams-lead-dashboard sample 2021-10-05 23:33:22 +02:00
.gitignore Added react-teams-lead-dashboard sample 2021-10-05 23:33:22 +02:00
.yo-rc.json Added react-teams-lead-dashboard sample 2021-10-05 23:33:22 +02:00
README.md Updated compatiblity matrix 2021-11-07 01:43:55 -04:00
gulpfile.js Added react-teams-lead-dashboard sample 2021-10-05 23:33:22 +02:00
package-lock.json Added react-teams-lead-dashboard sample 2021-10-05 23:33:22 +02:00
package.json Improved react-teams-lead-dashboard sample 2021-10-06 11:46:19 +02:00
tsconfig.json Added react-teams-lead-dashboard sample 2021-10-05 23:33:22 +02:00
tslint.json Added react-teams-lead-dashboard sample 2021-10-05 23:33:22 +02:00

README.md

Lead Assist Dashboard

Summary

This sample shows how to integrate SharePoint Framework, PnP React Controls, and Microsoft Graph Toolkit in a solution available for SharePoint web parts or Microsoft Teams personal application.

Lead Assist Dashboard

Compatibility

SPFx 1.12.1 Node.js v14 | v12 | v10 Compatible with SharePoint Online Does not work with SharePoint 2019 Does not work with SharePoint 2016 (Feature Pack 2) Local Workbench Compatible Hosted Workbench Compatible

Applies to

Get your own free development tenant by subscribing to Microsoft 365 developer program

Solution

Solution Author(s)
Lead Assist Dashboard PnP

Version history

Version Date Comments
1.0.0 October 5, 2021 Initial release

Minimal Path to Awesome

  • Clone this repository
  • Ensure that you are at the solution folder
  • In the command-line run:
    • npm install
    • npm run package
  • Upload the generated SPPKG file into the SharePoint App Catalog of your tenant
  • Select the SPPKG in the App Catalog and click on "Sync to Teams" button
  • Add the web part to a SharePoint page
  • In the first run the web part will ask for the target SharePoint site URL

If needed:

  • Using the control panel of the web part
    • Create the SharePoint demo lists
    • Populate the SharePoint demo lists
    • Generate the Microsoft Graph demo data

Features

This solution provides an example of how to implement a SharePoint Framework web part, that is also usable as a Microsoft Teams personal app, using the SharePoint Framework React Controls and the Microsoft Graph Toolkit.

This web part illustrates the following concepts:

  • How to use the PnP React Controls such as the chart control Activity chart detail

  • How to integrate the Microsoft Graph Toolkit in a SharePoint Framework web part such as the Agenda control

    MGT Agenda control in action

    and the Todo control

    MGT Todo control in action

  • How to execute operations on SharePoint using PnP JS

References

Disclaimer

THIS CODE IS PROVIDED AS IS WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.

"Sharing is Caring"