fix: prevent undefined account error when logging out (#3082)

Author: Mnickii

index.html

@@ -13,7 +13,7 @@
 
     <script type="module">
       // import { registerMgtComponents, Providers, MockProvider, Msal2Provider } from 'https://unpkg.com/@microsoft/mgt@next/dist/bundle/mgt.es6.js';
-      import { registerMgtComponents, Providers, MockProvider, Msal2Provider } from './packages/mgt/dist/bundle/mgt.es6.js';
+      import { registerMgtComponents, Providers, MockProvider, Msal2Provider } from './packages/mgt/dist/bundle/mgt.js';
       // Providers.globalProvider = new MockProvider(true);
       Providers.globalProvider = new Msal2Provider({
         clientId: '2dfea037-938a-4ed8-9b35-c05708a1b241',

packages/mgt-components/src/components/mgt-login/mgt-login.ts

@@ -241,14 +241,12 @@ export class MgtLogin extends MgtTemplatedTaskComponent {
     }
 
     const provider = Providers.globalProvider;
-    if (provider?.isMultiAccountSupportedAndEnabled) {
-      localStorage.removeItem(provider.getActiveAccount().id + this._userDetailsKey);
-    }
     if (provider?.logout) {
+      const activeAccount = provider.getActiveAccount();
       await provider.logout();
       this.userDetails = null;
       if (provider.isMultiAccountSupportedAndEnabled) {
-        localStorage.removeItem(provider.getActiveAccount().id + this._userDetailsKey);
+        localStorage.removeItem(activeAccount?.id + this._userDetailsKey);
       }
       this.hideFlyout();
       this.fireCustomEvent('logoutCompleted');

packages/providers/mgt-msal2-provider/src/Msal2Provider.ts

@@ -531,12 +531,16 @@ export class Msal2Provider extends IProvider {
    */
   public getActiveAccount() {
     const account = this._publicClientApplication.getActiveAccount();
-    return {
-      name: account.name,
-      mail: account.username,
-      id: account.homeAccountId,
-      tenantId: account.tenantId
-    } as IProviderAccount;
+
+    if (account) {
+      return {
+        name: account.name,
+        mail: account.username,
+        id: account.homeAccountId,
+        tenantId: account.tenantId
+      } as IProviderAccount;
+    }
+    return undefined;
   }
 
   /**