Merge pull request #2271 from microsoftgraph/merge/main-to-next

merging main to next/fluentui

Author: gavinbarron

.github/policies/branch-protection.yml

@@ -0,0 +1,31 @@
+# Copyright (c) Microsoft Corporation.
+# Licensed under the MIT License.
+
+name: branch_protection_sdks
+description: Organization branch protection policy for Microsoft Graph Toolkit repository
+resource: repository
+configuration:
+  branchProtectionRules:
+  - branchNamePattern: next/*
+    requiredApprovingReviewsCount:
+      min: 1
+    # Must have a CODEOWNER approve for the PR to be merged.
+    requireCodeOwnersReview: true
+    
+    # Dismiss stale pull request approvals when new commits are pushed
+    dismissStaleReviews: true
+    
+    # Require conversation resolution before merging. Address all concerns, and resolve in the GitHub PR UI.
+    requiresConversationResolution: true
+
+    # Require status checks to pass before merging. TODO: this value should be true, we should work to support this.
+    # Used with the requiredStatusChecks setting to specify which checks must pass for the PR to be merged.
+    requiresStrictStatusChecks: true
+
+    requiredStatusChecks:
+    - GitOps/AdvancedSecurity
+    - license/cla
+    - check-build-matrix
+    
+    # TODO: all commits should be signed. We need to get everyone signing their commits.
+    requiresCommitSignatures: false

.github/workflows/codeql-analysis.yml

@@ -9,14 +9,14 @@
 # the `language` matrix defined below to confirm you have the correct set of
 # supported CodeQL languages.
 #
-name: "CodeQL"
+name: 'CodeQL'
 
 on:
   push:
-    branches: [ main, release/* ]
+    branches: [main, release/*, next/fluentui, next/mgt-chat]
   pull_request:
     # The branches below must be a subset of the branches above
-    branches: [ main, release/* ]
+    branches: [main, release/*, next/fluentui, next/mgt-chat]
   schedule:
     - cron: '29 20 * * 1'
 
@@ -28,40 +28,40 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        language: [ 'javascript' ]
+        language: ['javascript']
         # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python' ]
         # Learn more:
         # https://docs.github.com/en/free-pro-team@latest/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#changing-the-languages-that-are-analyzed
 
     steps:
-    - name: Checkout repository
-      uses: actions/checkout@v2
+      - name: Checkout repository
+        uses: actions/checkout@v2
 
-    # Initializes the CodeQL tools for scanning.
-    - name: Initialize CodeQL
-      uses: github/codeql-action/init@v1
-      with:
-        languages: ${{ matrix.language }}
-        # If you wish to specify custom queries, you can do so here or in a config file.
-        # By default, queries listed here will override any specified in a config file.
-        # Prefix the list here with "+" to use these queries and those in the config file.
-        # queries: ./path/to/local/query, your-org/your-repo/queries@main
+      # Initializes the CodeQL tools for scanning.
+      - name: Initialize CodeQL
+        uses: github/codeql-action/init@v2
+        with:
+          languages: ${{ matrix.language }}
+          # If you wish to specify custom queries, you can do so here or in a config file.
+          # By default, queries listed here will override any specified in a config file.
+          # Prefix the list here with "+" to use these queries and those in the config file.
+          # queries: ./path/to/local/query, your-org/your-repo/queries@main
 
-    # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
-    # If this step fails, then you should remove it and run the build manually (see below)
-    - name: Autobuild
-      uses: github/codeql-action/autobuild@v1
+      # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
+      # If this step fails, then you should remove it and run the build manually (see below)
+      - name: Autobuild
+        uses: github/codeql-action/autobuild@v2
 
-    # ℹ️ Command-line programs to run using the OS shell.
-    # 📚 https://git.io/JvXDl
+      # ℹ️ Command-line programs to run using the OS shell.
+      # 📚 https://git.io/JvXDl
 
-    # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
-    #    and modify them (or add more) to build your code if your project
-    #    uses a compiled language
+      # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
+      #    and modify them (or add more) to build your code if your project
+      #    uses a compiled language
 
-    #- run: |
-    #   make bootstrap
-    #   make release
+      #- run: |
+      #   make bootstrap
+      #   make release
 
-    - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v1
+      - name: Perform CodeQL Analysis
+        uses: github/codeql-action/analyze@v2

.github/workflows/pr.yml

@@ -62,3 +62,17 @@ jobs:
 
       - name: Write to Job Summary
         run: cat code-coverage-results.md >> $GITHUB_STEP_SUMMARY
+
+  # The check-build-matrix returns success if all matrix jobs in build are successful; otherwise, it returns a failure.
+  # Use this as a PR status check for GitHub Policy Service instead of individual matrix entry checks.
+  check-build-matrix:
+    runs-on: ubuntu-latest
+    needs: build
+    if: always()
+    steps:
+      - name: All build matrix options are successful
+        if: ${{ !(contains(needs.*.result, 'failure')) }}
+        run: exit 0
+      - name: One or more build matrix options failed
+        if: ${{ contains(needs.*.result, 'failure') }}
+        run: exit 1

artifacts/install.ps1

@@ -20,6 +20,6 @@ function Get-Packages {
   Write-Output $output
 }
 
-$packages = Get-Packages mgt-element mgt-msal-provider mgt-proxy-provider mgt-sharepoint-provider mgt-teams-provider mgt-components mgt mgt-react
+$packages = Get-Packages mgt-element mgt-msal2-provider mgt-proxy-provider mgt-sharepoint-provider mgt-teamsfx-provider mgt-components mgt mgt-react
 
 npm i $packages

auth.html

@@ -1,16 +1,9 @@
 <html>
   <head>
     <script src="https://unpkg.com/@microsoft/teams-js@2/dist/MicrosoftTeams.min.js" crossorigin="anonymous"></script>
-    <!-- <script src="./packages/mgt/dist/bundle/mgt-loader.js"></script>
-    <script>
-      mgt.TeamsProvider.handleAuth();
-    </script> -->
     <script type="module">
-      // import { TeamsProvider } from './packages/providers/mgt-teams-provider/dist/es6/TeamsProvider.js';
-      // TeamsProvider.handleAuth();
-
-      import { TeamsMsal2Provider } from './packages/providers/mgt-teams-msal2-provider/dist/es6/TeamsMsal2Provider.js';
-      TeamsMsal2Provider.handleAuth();
+      import { TeamsFxProvider } from './packages/providers/mgt-teamsfx-provider/dist/es6/TeamsFxProvider.js';
+      // TODO: show how to use TeamsFx in auth.
     </script>
   </head>
   <body>

index.html

@@ -30,33 +30,6 @@
   </head>
 
   <body>
-    <!-- <mgt-teams-provider
-      client-id="a974dfa0-9f57-49b9-95db-90f04ce2111a"
-      auth-popup-url="auth.html"
-    ></mgt-teams-provider> -->
-
-    <!-- <mgt-teams-msal2-provider
-      client-id="72482bff-ecae-44f5-8fdc-513b7f5602e7"
-      scopes="user.read,user.read.all,mail.readBasic,people.read,people.read.all,sites.read.all,user.readbasic.all,contacts.read,presence.read,presence.read.all,tasks.readwrite,tasks.read,calendars.read,group.read.all"
-      auth-popup-url="auth.html"
-    ></mgt-teams-msal2-provider> -->
-
-    <!-- Teams Msal2 provider in SSO mode (see "teams-sso-node" sample) -->
-    <!-- <mgt-teams-msal2-provider
-      client-id="72482bff-ecae-44f5-8fdc-513b7f5602e7"
-      scopes="user.read,user.read.all,mail.readBasic,people.read,people.read.all,sites.read.all,user.readbasic.all,contacts.read,presence.read,presence.read.all,tasks.readwrite,tasks.read,calendars.read,group.read.all"
-      auth-popup-url="auth.html"
-      sso-url="http://localhost:5000/api/token"
-      http-method="POST"
-    ></mgt-teams-msal2-provider> -->
-
-    <!-- <mgt-msal-provider
-      client-id="a974dfa0-9f57-49b9-95db-90f04ce2111a"
-      scopes="user.read,user.read.all,mail.readBasic,people.read,people.read.all,sites.read.all,user.readbasic.all,contacts.read,presence.read,presence.read.all,tasks.readwrite,tasks.read,calendars.read,group.read.all"
-      redirect-uri="http://localhost:3000"
-      depends-on="mgt-teams-provider"
-    ></mgt-msal-provider> -->
-
     <!-- <mgt-msal2-provider
       client-id="2dfea037-938a-4ed8-9b35-c05708a1b241"
       redirect-uri="http://localhost:3000"

packages/mgt-components/README.md

@@ -33,7 +33,7 @@ The components can be used on their own, but they are at their best when they ar
 1. Install the packages
 
     ```bash
-    npm install @microsoft/mgt-element @microsoft/mgt-components @microsoft/mgt-msal-provider
+    npm install @microsoft/mgt-element @microsoft/mgt-components @microsoft/mgt-msal2-provider
     ```
 
 1. Use components in your code
@@ -47,7 +47,7 @@ The components can be used on their own, but they are at their best when they ar
       import '@microsoft/mgt-components';
 
       // initialize the auth provider globally
-      Providers.globalProvider = new MsalProvider({clientId: 'clientId'});
+      Providers.globalProvider = new Msal2Provider({clientId: 'clientId'});
     </script>
 
     <mgt-login></mgt-login>

packages/mgt-element/README.md

@@ -2,32 +2,32 @@
 
 [![npm](https://img.shields.io/npm/v/@microsoft/mgt-element?style=for-the-badge)](https://www.npmjs.com/package/@microsoft/mgt-element)
 
-The [Microsoft Graph Toolkit (mgt)](https://aka.ms/mgt) library is a collection of authentication providers and UI components powered by Microsoft Graph. 
+The [Microsoft Graph Toolkit (mgt)](https://aka.ms/mgt) library is a collection of authentication providers and UI components powered by Microsoft Graph.
 
 The `@microsoft/mgt-element` package contains all base classes that enable the providers and components to work together. Use this package to set the global provider, or to create your own providers and/or components that work with Microsoft Graph.
 
 [See docs for full documentation](https://aka.ms/mgt-docs)
 
 ## Set and use the global provider
 
-The `@microsoft/mgt-element` package exposes the `Providers` namespace that enables global usage of the authentication providers across your entire app. 
+The `@microsoft/mgt-element` package exposes the `Providers` namespace that enables global usage of the authentication providers across your entire app.
 
 This example illustrates how to instantiate a new provider (MsalProvider in this case) and use it across your app:
 
-1. Install the packages 
+1. Install the packages
 
     ```bash
-    npm install @microsoft/mgt-element @microsoft/mgt-msal-provider
+    npm install @microsoft/mgt-element @microsoft/mgt-msal2-provider
     ```
 
 1. Create the provider
 
     ```ts
     import {Providers} from '@microsoft/mgt-element';
-    import {MsalProvider} from '@microsoft/mgt-msal-provider';
+    import {Msal2Provider} from '@microsoft/mgt-msal2-provider';
 
     // initialize the auth provider globally
-    Providers.globalProvider = new MsalProvider({clientId: 'clientId'});
+    Providers.globalProvider = new Msal2Provider({clientId: 'clientId'});
     ```
 
 1. Use the provider to sign in and call the graph:

packages/mgt-react/package.json

@@ -40,6 +40,10 @@
     "@microsoft/microsoft-graph-types-beta": "^0.29.0-preview",
     "wc-react": "^0.5.0"
   },
+  "peerDependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1"
+  },
   "publishConfig": {
     "access": "public"
   }

packages/mgt/README.md

@@ -51,12 +51,12 @@ You can use the components by referencing the loader directly (via unpkg), or in
 
 > NOTE: This link will load the highest available version of @microsoft/mgt in the range `>= 2.0.0 < 3.0.0`, omitting the `@2` fragment from the url results in loading the latest version. This could result in loading a new major version and breaking the application.
 
-You can then start using the components in your html page. Here is a full working example with the Msal provider:
+You can then start using the components in your html page. Here is a full working example with the Msal2 provider:
 
 ```html
 <script src="https://unpkg.com/@microsoft/mgt@2/dist/bundle/mgt-loader.js"></script>
 
-<mgt-msal-provider client-id="[CLIENT-ID]"></mgt-msal-provider>
+<mgt-msal2-provider client-id="[CLIENT-ID]"></mgt-msal2-provider>
 
 <mgt-login></mgt-login>
 <mgt-agenda></mgt-agenda>
@@ -77,7 +77,7 @@ Now you can reference all components and providers at the page you are using:
 ```html
 <script type="module" src="node_modules/@microsoft/mgt/dist/es6/index.js"></script>
 
-<mgt-msal-provider client-id="[CLIENT-ID]"></mgt-msal-provider>
+<mgt-msal2-provider client-id="[CLIENT-ID]"></mgt-msal2-provider>
 
 <mgt-login></mgt-login>
 <mgt-agenda></mgt-agenda>