5.3 Login to your tenant & retrieve environment details

Sign in process

In order to sign in to your tenant you must have SPFx Toolkit opened in the context of a SharePoint Framework project. In the account panel you may use the Sign in to Microsoft 365 button to start the process

Alternatively, you may use the >SharePoint Framework Toolkit: Sign in to Microsoft 365 command to do the same

SPFx Toolkit needs and Entra App Registration to be able to sign in to your tenant. You may either use an existing app registration or create a new one with a single click using a dedicated form.

SPFx Toolkit will guide you through the process of creating a new app registration either manually by providing step-by-step guidance or automatically by creating the app registration for you.

Check it out in action 👇

If you already have an Entra App Registration you may use it to sign in to your tenant by providing the Client Id and Tenant Id.

Manual setup of Entra App Registration

If possible it is recommended to use the automated way to setup the SPFx Toolkit App Registration. Otherwise please follow the manual steps to perform it manually (this is required only one time on each tenant)

• Navigate to the Azure Portal
• Select Microsoft Entra ID from the global menu, select App Registrations in the Microsoft Entra ID blade and then select the New registration action button to open the Register an application form.

• In the form, enter a name for your new application. It's recommended to name this app SPFx Toolkit but you may give it any preferable name
• Leave the Supported account types and Redirect URI values as they are and select the Register button at the foot of the form to create your custom application

• Next we need to configure the Authentication for our new app. Go to the Authentication page and select the Add a platform button to open up the Configure platforms menu and under the Mobile and desktop applications heading, select Mobile and desktop applications. This will open another menu called Configure Desktop + Devices displaying a section called Redirect URIs and a list of checkboxes with some pre-defined URIs.

• Select the first option in the list, https://login.microsoftonline.com/common/oauth2/nativeclient and select the Configure button at the foot of the menu.

• we can skip over the Supported account type section, as this is defaulted to Accounts in this organizational directory only (tenant only - Single tenant) meaning, that only users within the current tenant directory can use this application.
• In the Advanced settings section, we need to enable the Allow public client flows toggle, as we are using the Device code flow method to authenticate to our tenant using the CLI for Microsoft 365.

• To make sure all these changes are applied, select the Save button before moving on.
• Now that we have configured the application to work with the SPFx Toolkit, we next need to grant the required permissions. Select the API permissions in the menu option.

            You will see a section called <code>Configured permissions</code> with one permission already granted. This is the default permission which allows the application to sign in the user account used when authenticating to the Microsoft Graph.
            Add the following permissions:
                    
                - Microsoft Graph:
                    - AppCatalog.ReadWrite.All
                    - AuditLog.Read.All
                    - Directory.AccessAsUser.All
                    - Directory.ReadWrite.All
                    - SecurityEvents.Read.All
                    - ServiceHealth.Read.All
                    - ServiceMessage.Read.All
                    - Sites.Read.All
                    - User.Read
               
                - Azure Active Directory Graph
                    - Directory.AccessAsUser.All
                
                - Azure Service Management
                    - user_impersonation

                - Office 365 Management APIs:
                    - ActivityFeed.Read
                    - ServiceHealth.Read

                - SharePoint:
                    - AllSites.FullControl
                    - User.ReadWrite.All

• Go to Overview page and note down the Application (client) ID and Directory (tenant) ID
• Click on the Sign in to Microsoft 365 and provide the noted down Client Id and Tenant Id

Environment details and manage capabilities

The extension will retrieve helpful URLs from your tenant like link to:

• SharePoint main site
• SharePoint admin site
• SharePoint web API permission management page

Additionally, the extension will check and retrieve tenant service health incidents that are currently happening in your tenant so that you gain quick insights on your tenant health.

After successful sign in, an additional view is presented that shows a list of links to app catalogs available in the tenant, both tenant-level and all site-level app catalogs. You can expand each app catalog to reveal the list of apps contained within. Selecting an app navigates you to its details page. Additionally, hovering over an app node presents a set of actions, allowing you to perform various operations directly on the selected app.

• Deploy: Makes the solution available for installation in sites but does not automatically install it.
• Retract: Reverses the deployment, preventing the solution from being installed in sites.
• Remove: Removes the app from the app catalog.
• Enable: Allows end users to add the solution to their SharePoint sites.
• Disable: Hides the solution from end users, preventing them from adding it to sites.
• Upgrade: Upgrades the solution to the latest version available in the app catalog for the specified site.

Using the extension settings you may choose show or hide the tenant-wide extensions list and tenant health incidents list.

Sign-in is also required for some actions to work properly like the deploy action which allows you to upload of the .sppkg file to the tenant or site-level App Catalog.