@azure/msal-react - npm Package Compare versions

Comparing version 1.0.0-alpha.0 to 1.0.0-alpha.1

CHANGELOG.json

@@ -5,2 +5,53 @@ {
     {
+      "date": "Mon, 07 Dec 2020 22:19:03 GMT",
+      "tag": "@azure/msal-react_v1.0.0-alpha.1",
+      "version": "1.0.0-alpha.1",
+      "comments": {
+        "prerelease": [
+          {
+            "comment": "Prevent unnecessary context updates (#2671)",
+            "author": "[e-mail]",
+            "commit": "a1ba4a5037480a23d22d3a72a4217650028953d2",
+            "package": "@azure/msal-react"
+          },
+          {
+            "comment": "Updating TestConstants.ts",
+            "author": "[e-mail]",
+            "commit": "b921279b4f285d2984b8458f27348d3f734b0d67",
+            "package": "@azure/msal-react"
+          },
+          {
+            "comment": "Readme Updates",
+            "author": "[e-mail]",
+            "commit": "4c9729742d82fc51cf7b823bd376e6551dcd851b",
+            "package": "@azure/msal-react"
+          },
+          {
+            "comment": "Fix Server/Client mismatch when using SSR (#2646)",
+            "author": "[e-mail]",
+            "commit": "23b292184da04a397f985f6453f22810c40d1fbc",
+            "package": "@azure/msal-react"
+          },
+          {
+            "comment": "useMsalAuthentication consumes response from login callback (#2610)",
+            "author": "[e-mail]",
+            "commit": "9c029bc074ecd32483a45cfab8721f0771c31e55",
+            "package": "@azure/msal-react"
+          },
+          {
+            "comment": "Update msal-react ssoSilent example",
+            "author": "[e-mail]",
+            "commit": "46bef2f0e3a2ffacc9fd4d69c6016f5528d630a5",
+            "package": "@azure/msal-react"
+          },
+          {
+            "comment": "Readme updates (#2592)",
+            "author": "[e-mail]",
+            "commit": "cfea3b511ebfcd4a22334a1b7c7625f8a7a3a098",
+            "package": "@azure/msal-react"
+          }
+        ]
+      }
+    },
+    {
       "date": "Wed, 11 Nov 2020 23:33:20 GMT",
@@ -7,0 +58,0 @@ "tag": "@azure/msal-react_v1.0.0-alpha.0",

dist/components/MsalAuthenticationTemplate.d.ts

 import React, { PropsWithChildren } from "react";
 import { AccountIdentifiers } from "../types/AccountIdentifiers";
+import { MsalAuthenticationResult } from "../hooks/useMsalAuthentication";
 import { InteractionType, PopupRequest, RedirectRequest, SsoSilentRequest } from "@azure/msal-browser";
+import { IMsalContext } from "../MsalContext";
 export declare type MsalAuthenticationProps = PropsWithChildren<AccountIdentifiers & {
     interactionType: InteractionType;
     authenticationRequest?: PopupRequest | RedirectRequest | SsoSilentRequest;
-    loadingComponent?: React.ReactNode;
-    errorComponent?: React.ReactNode;
+    loadingComponent?: React.ElementType<IMsalContext>;
+    errorComponent?: React.ElementType<MsalAuthenticationResult>;
 }>;
@@ -14,2 +16,2 @@ /**
  */
-export declare function MsalAuthenticationTemplate({ interactionType, username, homeAccountId, localAccountId, authenticationRequest, loadingComponent, errorComponent, children }: MsalAuthenticationProps): React.ReactElement | null;
+export declare function MsalAuthenticationTemplate({ interactionType, username, homeAccountId, localAccountId, authenticationRequest, loadingComponent: LoadingComponent, errorComponent: ErrorComponent, children }: MsalAuthenticationProps): React.ReactElement | null;

dist/hooks/useIsAuthenticated.d.ts

 import { AccountIdentifiers } from "../types/AccountIdentifiers";
-export declare function useIsAuthenticated(accountIdentifiers?: AccountIdentifiers): boolean;
+export declare function useIsAuthenticated(matchAccount?: AccountIdentifiers): boolean;

dist/hooks/useMsalAuthentication.d.ts

@@ -8,2 +8,2 @@ import { PopupRequest, RedirectRequest, SsoSilentRequest, InteractionType, AuthenticationResult, AuthError } from "@azure/msal-browser";
 };
-export declare function useMsalAuthentication(interactionType: InteractionType, authenticationRequest?: PopupRequest | RedirectRequest | SsoSilentRequest, accountIdentifier?: AccountIdentifiers): MsalAuthenticationResult;
+export declare function useMsalAuthentication(interactionType: InteractionType, authenticationRequest?: PopupRequest | RedirectRequest | SsoSilentRequest, accountIdentifiers?: AccountIdentifiers): MsalAuthenticationResult;

dist/msal-react.cjs.development.js

@@ -48,2 +48,37 @@ 'use strict';
  */
+function getChildrenOrFunction(children, args) {
+  if (typeof children === "function") {
+    return children(args);
+  }
+
+  return children;
+}
+/**
+ * Helper function to determine whether 2 arrays are equal
+ * Used to avoid unnecessary state updates
+ * @param arrayA
+ * @param arrayB
+ */
+
+function accountArraysAreEqual(arrayA, arrayB) {
+  if (arrayA.length !== arrayB.length) {
+    return false;
+  }
+
+  var comparisonArray = [].concat(arrayB);
+  return arrayA.every(function (elementA) {
+    var elementB = comparisonArray.shift();
+
+    if (!elementA || !elementB) {
+      return false;
+    }
+
+    return elementA.homeAccountId === elementB.homeAccountId && elementA.localAccountId === elementB.localAccountId && elementA.username === elementB.username;
+  });
+}
+
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
 function MsalProvider(_ref) {
@@ -54,3 +89,3 @@ var instance = _ref.instance,
   // State hook to store accounts
-  var _useState = React.useState(instance.getAllAccounts()),
+  var _useState = React.useState([]),
       accounts = _useState[0],
@@ -67,2 +102,29 @@ setAccounts = _useState[1]; // State hook to store in progress value
       switch (message.eventType) {
+        case msalBrowser.EventType.LOGIN_SUCCESS:
+        case msalBrowser.EventType.SSO_SILENT_SUCCESS:
+        case msalBrowser.EventType.HANDLE_REDIRECT_END:
+        case msalBrowser.EventType.LOGIN_FAILURE:
+        case msalBrowser.EventType.SSO_SILENT_FAILURE:
+        case msalBrowser.EventType.LOGOUT_FAILURE:
+        case msalBrowser.EventType.ACQUIRE_TOKEN_SUCCESS:
+        case msalBrowser.EventType.ACQUIRE_TOKEN_FAILURE:
+          var currentAccounts = instance.getAllAccounts();
+
+          if (!accountArraysAreEqual(currentAccounts, accounts)) {
+            setAccounts(currentAccounts);
+          }
+
+          break;
+      }
+    });
+    return function () {
+      // Remove callback when component unmounts or accounts change
+      if (callbackId) {
+        instance.removeEventCallback(callbackId);
+      }
+    };
+  }, [instance, accounts]);
+  React.useEffect(function () {
+    var callbackId = instance.addEventCallback(function (message) {
+      switch (message.eventType) {
         case msalBrowser.EventType.LOGIN_START:
@@ -97,3 +159,2 @@ setInProgress(InteractionStatus.Login);
         case msalBrowser.EventType.LOGOUT_FAILURE:
-          setAccounts(instance.getAllAccounts());
           setInProgress(InteractionStatus.None);
@@ -104,4 +165,2 @@ break;
         case msalBrowser.EventType.ACQUIRE_TOKEN_FAILURE:
-          setAccounts(instance.getAllAccounts());
-
           if (message.interactionType === msalBrowser.InteractionType.Redirect || message.interactionType === msalBrowser.InteractionType.Popup) {
@@ -114,8 +173,12 @@ setInProgress(InteractionStatus.None);
     });
-    instance.handleRedirectPromise();
+    instance.handleRedirectPromise()["catch"](function () {
+      // Errors should be handled by listening to the LOGIN_FAILURE event
+      return;
+    });
     return function () {
-      callbackId && instance.removeEventCallback(callbackId);
+      if (callbackId) {
+        instance.removeEventCallback(callbackId);
+      }
     };
-  }, [instance]); // Memoized context value
-
+  }, [instance]);
   var contextValue = {
@@ -135,14 +198,2 @@ instance: instance,
  */
-function getChildrenOrFunction(children, args) {
-  if (typeof children === "function") {
-    return children(args);
-  }
-
-  return children;
-}
-
-/*
- * Copyright (c) Microsoft Corporation. All rights reserved.
- * Licensed under the MIT License.
- */
 var useMsal = function useMsal() {
@@ -158,11 +209,24 @@ return React.useContext(MsalContext);
 function getAccount(instance, accountIdentifiers) {
-  if (accountIdentifiers.localAccountId) {
-    return instance.getAccountByLocalId(accountIdentifiers.localAccountId);
-  } else if (accountIdentifiers.homeAccountId) {
-    return instance.getAccountByHomeId(accountIdentifiers.homeAccountId);
-  } else if (accountIdentifiers.username) {
-    return instance.getAccountByUsername(accountIdentifiers.username);
+  var allAccounts = instance.getAllAccounts();
+
+  if (allAccounts.length > 0 && (accountIdentifiers.homeAccountId || accountIdentifiers.localAccountId || accountIdentifiers.username)) {
+    var matchedAccounts = allAccounts.filter(function (accountObj) {
+      if (accountIdentifiers.username && accountIdentifiers.username.toLowerCase() !== accountObj.username.toLowerCase()) {
+        return false;
+      }
+
+      if (accountIdentifiers.homeAccountId && accountIdentifiers.homeAccountId.toLowerCase() !== accountObj.homeAccountId.toLowerCase()) {
+        return false;
+      }
+
+      if (accountIdentifiers.localAccountId && accountIdentifiers.localAccountId.toLowerCase() !== accountObj.localAccountId.toLowerCase()) {
+        return false;
+      }
+
+      return true;
+    });
+    return matchedAccounts[0] || null;
+  } else {
+    return null;
   }
-
-  return null;
 }
@@ -190,4 +254,4 @@
 
-function isAuthenticated(allAccounts, account, accountIdentifiers) {
-  if (accountIdentifiers && (accountIdentifiers.username || accountIdentifiers.homeAccountId || accountIdentifiers.localAccountId)) {
+function isAuthenticated(allAccounts, account, matchAccount) {
+  if (matchAccount && (matchAccount.username || matchAccount.homeAccountId || matchAccount.localAccountId)) {
     return !!account;
@@ -199,9 +263,9 @@ }
 
-function useIsAuthenticated(accountIdentifiers) {
+function useIsAuthenticated(matchAccount) {
   var _useMsal = useMsal(),
       allAccounts = _useMsal.accounts;
 
-  var account = useAccount(accountIdentifiers || {});
+  var account = useAccount(matchAccount || {});
 
-  var _useState = React.useState(isAuthenticated(allAccounts, account, accountIdentifiers)),
+  var _useState = React.useState(false),
       hasAuthenticated = _useState[0],
@@ -211,4 +275,4 @@ setHasAuthenticated = _useState[1];
   React.useEffect(function () {
-    setHasAuthenticated(isAuthenticated(allAccounts, account, accountIdentifiers));
-  }, [allAccounts, account, accountIdentifiers]);
+    setHasAuthenticated(isAuthenticated(allAccounts, account, matchAccount));
+  }, [allAccounts, account, matchAccount]);
   return hasAuthenticated;
@@ -1069,10 +1133,3 @@ }
 
-function useMsalAuthentication(interactionType, authenticationRequest, accountIdentifier) {
-  var isMounted = React.useRef(true);
-  React.useEffect(function () {
-    return function () {
-      isMounted.current = false;
-    };
-  }, []);
-
+function useMsalAuthentication(interactionType, authenticationRequest, accountIdentifiers) {
   var _useMsal = useMsal(),
@@ -1082,3 +1139,3 @@ instance = _useMsal.instance,
 
-  var isAuthenticated = useIsAuthenticated(accountIdentifier);
+  var isAuthenticated = useIsAuthenticated(accountIdentifiers);
 
@@ -1096,3 +1153,4 @@ var _useState = React.useState([null, null]),
   var login = React.useCallback( /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(loginType, request) {
+    var _ref = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(callbackInteractionType, callbackRequest) {
+      var loginType, loginRequest;
       return runtime_1.wrap(function _callee$(_context) {
@@ -1102,19 +1160,21 @@ while (1) {
             case 0:
+              loginType = callbackInteractionType || interactionType;
+              loginRequest = callbackRequest || authenticationRequest;
               _context.t0 = loginType;
-              _context.next = _context.t0 === msalBrowser.InteractionType.Popup ? 3 : _context.t0 === msalBrowser.InteractionType.Redirect ? 4 : _context.t0 === msalBrowser.InteractionType.Silent ? 5 : 6;
+              _context.next = _context.t0 === msalBrowser.InteractionType.Popup ? 5 : _context.t0 === msalBrowser.InteractionType.Redirect ? 6 : _context.t0 === msalBrowser.InteractionType.Silent ? 7 : 8;
               break;
 
-            case 3:
-              return _context.abrupt("return", instance.loginPopup(request));
+            case 5:
+              return _context.abrupt("return", instance.loginPopup(loginRequest));
 
-            case 4:
-              return _context.abrupt("return", instance.loginRedirect(request).then(null));
+            case 6:
+              return _context.abrupt("return", instance.loginRedirect(loginRequest).then(null));
 
-            case 5:
-              return _context.abrupt("return", instance.ssoSilent(request));
+            case 7:
+              return _context.abrupt("return", instance.ssoSilent(loginRequest));
 
-            case 6:
+            case 8:
               throw "Invalid interaction type provided.";
 
-            case 7:
+            case 9:
             case "end":
@@ -1130,14 +1190,39 @@ return _context.stop();
     };
-  }(), [instance]);
+  }(), [instance, interactionType, authenticationRequest]);
   React.useEffect(function () {
+    var callbackId = instance.addEventCallback(function (message) {
+      switch (message.eventType) {
+        case msalBrowser.EventType.LOGIN_SUCCESS:
+        case msalBrowser.EventType.SSO_SILENT_SUCCESS:
+          if (message.payload) {
+            setResponse([message.payload, null]);
+          }
+
+          break;
+
+        case msalBrowser.EventType.LOGIN_FAILURE:
+        case msalBrowser.EventType.SSO_SILENT_FAILURE:
+          if (message.error) {
+            setResponse([null, message.error]);
+          }
+
+          break;
+      }
+    });
+    return function () {
+      if (callbackId) {
+        instance.removeEventCallback(callbackId);
+      }
+    };
+  }, [instance]);
+  React.useEffect(function () {
     if (!hasBeenCalled && !isAuthenticated && inProgress === InteractionStatus.None) {
       // Ensure login is only called one time from within this hook, any subsequent login attempts should use the callback returned
       setHasBeenCalled(true);
-      login(interactionType, authenticationRequest).then(function (result) {
-        isMounted.current && setResponse([result, null]);
-      })["catch"](function (error) {
-        isMounted.current && setResponse([null, error]);
+      login()["catch"](function () {
+        // Errors are handled by the event handler above
+        return;
       });
     }
-  }, [isAuthenticated, inProgress, hasBeenCalled, interactionType, authenticationRequest, login]);
+  }, [isAuthenticated, inProgress, hasBeenCalled, login]);
   return {
@@ -1165,4 +1250,4 @@ login: login,
       authenticationRequest = _ref.authenticationRequest,
-      loadingComponent = _ref.loadingComponent,
-      errorComponent = _ref.errorComponent,
+      LoadingComponent = _ref.loadingComponent,
+      ErrorComponent = _ref.errorComponent,
       children = _ref.children;
@@ -1180,5 +1265,5 @@ var accountIdentifier = React.useMemo(function () {
 
-  if (msalAuthResult.error) {
-    if (!!errorComponent) {
-      return React__default.createElement(React__default.Fragment, null, getChildrenOrFunction(errorComponent, msalAuthResult));
+  if (msalAuthResult.error && context.inProgress === InteractionStatus.None) {
+    if (!!ErrorComponent) {
+      return React__default.createElement(ErrorComponent, Object.assign({}, msalAuthResult));
     }
@@ -1193,4 +1278,4 @@
 
-  if (!!loadingComponent || context.inProgress !== InteractionStatus.None) {
-    return React__default.createElement(React__default.Fragment, null, getChildrenOrFunction(loadingComponent, context));
+  if (!!LoadingComponent && context.inProgress !== InteractionStatus.None) {
+    return React__default.createElement(LoadingComponent, Object.assign({}, context));
   }
@@ -1197,0 +1282,0 @@

dist/msal-react.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t,e,n=require("react"),r=(t=n)&&"object"==typeof t&&"default"in t?t.default:t,o=require("@azure/msal-browser");!function(t){t.Startup="startup",t.Login="login",t.Logout="logout",t.AcquireToken="acquireToken",t.SsoSilent="ssoSilent",t.HandleRedirect="handleRedirect",t.None="none"}(e||(e={}));var i=n.createContext({instance:o.stubbedPublicClientApplication,inProgress:e.None,accounts:[]}),a=i.Consumer;function c(t,e){return"function"==typeof t?t(e):t}var u=function(){return n.useContext(i)};function s(t){var e=u(),r=e.instance,o=e.inProgress,i=n.useState(null),a=i[0],c=i[1];return n.useEffect((function(){c(function(t,e){return e.localAccountId?t.getAccountByLocalId(e.localAccountId):e.homeAccountId?t.getAccountByHomeId(e.homeAccountId):e.username?t.getAccountByUsername(e.username):null}(r,t))}),[o,t,r]),a}function l(t,e,n){return n&&(n.username||n.homeAccountId||n.localAccountId)?!!e:t.length>0}function f(t){var e=u().accounts,r=s(t||{}),o=n.useState(l(e,r,t)),i=o[0],a=o[1];return n.useEffect((function(){a(l(e,r,t))}),[e,r,t]),i}function h(t,e,n,r,o,i,a){try{var c=t[i](a),u=c.value}catch(t){return void n(t)}c.done?e(u):Promise.resolve(u).then(r,o)}var p,d=(function(t){var e=function(t){var e=Object.prototype,n=e.hasOwnProperty,r="function"==typeof Symbol?Symbol:{},o=r.iterator||"@@iterator",i=r.asyncIterator||"@@asyncIterator",a=r.toStringTag||"@@toStringTag";function c(t,e,n){return Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{c({},"")}catch(t){c=function(t,e,n){return t[e]=n}}function u(t,e,n,r){var o=Object.create((e&&e.prototype instanceof f?e:f).prototype),i=new x(r||[]);return o._invoke=function(t,e,n){var r="suspendedStart";return function(o,i){if("executing"===r)throw new Error("Generator is already running");if("completed"===r){if("throw"===o)throw i;return{value:void 0,done:!0}}for(n.method=o,n.arg=i;;){var a=n.delegate;if(a){var c=T(a,n);if(c){if(c===l)continue;return c}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if("suspendedStart"===r)throw r="completed",n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);r="executing";var u=s(t,e,n);if("normal"===u.type){if(r=n.done?"completed":"suspendedYield",u.arg===l)continue;return{value:u.arg,done:n.done}}"throw"===u.type&&(r="completed",n.method="throw",n.arg=u.arg)}}}(t,n,i),o}function s(t,e,n){try{return{type:"normal",arg:t.call(e,n)}}catch(t){return{type:"throw",arg:t}}}t.wrap=u;var l={};function f(){}function h(){}function p(){}var d={};d[o]=function(){return this};var v=Object.getPrototypeOf,y=v&&v(v(I([])));y&&y!==e&&n.call(y,o)&&(d=y);var m=p.prototype=f.prototype=Object.create(d);function g(t){["next","throw","return"].forEach((function(e){c(t,e,(function(t){return this._invoke(e,t)}))}))}function E(t,e){var r;this._invoke=function(o,i){function a(){return new e((function(r,a){!function r(o,i,a,c){var u=s(t[o],t,i);if("throw"!==u.type){var l=u.arg,f=l.value;return f&&"object"==typeof f&&n.call(f,"__await")?e.resolve(f.__await).then((function(t){r("next",t,a,c)}),(function(t){r("throw",t,a,c)})):e.resolve(f).then((function(t){l.value=t,a(l)}),(function(t){return r("throw",t,a,c)}))}c(u.arg)}(o,i,r,a)}))}return r=r?r.then(a,a):a()}}function T(t,e){var n=t.iterator[e.method];if(void 0===n){if(e.delegate=null,"throw"===e.method){if(t.iterator.return&&(e.method="return",e.arg=void 0,T(t,e),"throw"===e.method))return l;e.method="throw",e.arg=new TypeError("The iterator does not provide a 'throw' method")}return l}var r=s(n,t.iterator,e.arg);if("throw"===r.type)return e.method="throw",e.arg=r.arg,e.delegate=null,l;var o=r.arg;return o?o.done?(e[t.resultName]=o.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=void 0),e.delegate=null,l):o:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,l)}function w(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function A(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function x(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(w,this),this.reset(!0)}function I(t){if(t){var e=t[o];if(e)return e.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var r=-1,i=function e(){for(;++r<t.length;)if(n.call(t,r))return e.value=t[r],e.done=!1,e;return e.value=void 0,e.done=!0,e};return i.next=i}}return{next:L}}function L(){return{value:void 0,done:!0}}return h.prototype=m.constructor=p,p.constructor=h,h.displayName=c(p,a,"GeneratorFunction"),t.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===h||"GeneratorFunction"===(e.displayName||e.name))},t.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,p):(t.__proto__=p,c(t,a,"GeneratorFunction")),t.prototype=Object.create(m),t},t.awrap=function(t){return{__await:t}},g(E.prototype),E.prototype[i]=function(){return this},t.AsyncIterator=E,t.async=function(e,n,r,o,i){void 0===i&&(i=Promise);var a=new E(u(e,n,r,o),i);return t.isGeneratorFunction(n)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},g(m),c(m,a,"Generator"),m[o]=function(){return this},m.toString=function(){return"[object Generator]"},t.keys=function(t){var e=[];for(var n in t)e.push(n);return e.reverse(),function n(){for(;e.length;){var r=e.pop();if(r in t)return n.value=r,n.done=!1,n}return n.done=!0,n}},t.values=I,x.prototype={constructor:x,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(A),!t)for(var e in this)"t"===e.charAt(0)&&n.call(this,e)&&!isNaN(+e.slice(1))&&(this[e]=void 0)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var e=this;function r(n,r){return a.type="throw",a.arg=t,e.next=n,r&&(e.method="next",e.arg=void 0),!!r}for(var o=this.tryEntries.length-1;o>=0;--o){var i=this.tryEntries[o],a=i.completion;if("root"===i.tryLoc)return r("end");if(i.tryLoc<=this.prev){var c=n.call(i,"catchLoc"),u=n.call(i,"finallyLoc");if(c&&u){if(this.prev<i.catchLoc)return r(i.catchLoc,!0);if(this.prev<i.finallyLoc)return r(i.finallyLoc)}else if(c){if(this.prev<i.catchLoc)return r(i.catchLoc,!0)}else{if(!u)throw new Error("try statement without catch or finally");if(this.prev<i.finallyLoc)return r(i.finallyLoc)}}}},abrupt:function(t,e){for(var r=this.tryEntries.length-1;r>=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev<o.finallyLoc){var i=o;break}}i&&("break"===t||"continue"===t)&&i.tryLoc<=e&&e<=i.finallyLoc&&(i=null);var a=i?i.completion:{};return a.type=t,a.arg=e,i?(this.method="next",this.next=i.finallyLoc,l):this.complete(a)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),l},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var n=this.tryEntries[e];if(n.finallyLoc===t)return this.complete(n.completion,n.afterLoc),A(n),l}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var n=this.tryEntries[e];if(n.tryLoc===t){var r=n.completion;if("throw"===r.type){var o=r.arg;A(n)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,n){return this.delegate={iterator:I(t),resultName:e,nextLoc:n},"next"===this.method&&(this.arg=void 0),l}},t}(t.exports);try{regeneratorRuntime=e}catch(t){Function("r","regeneratorRuntime = r")(e)}}(p={exports:{}}),p.exports);function v(t,r,i){var a=n.useRef(!0);n.useEffect((function(){return function(){a.current=!1}}),[]);var c=u(),s=c.instance,l=c.inProgress,p=f(i),v=n.useState([null,null]),y=v[0],m=y[0],g=y[1],E=v[1],T=n.useState(!1),w=T[0],A=T[1],x=n.useCallback(function(){var t,e=(t=d.mark((function t(e,n){return d.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:t.t0=e,t.next=t.t0===o.InteractionType.Popup?3:t.t0===o.InteractionType.Redirect?4:t.t0===o.InteractionType.Silent?5:6;break;case 3:return t.abrupt("return",s.loginPopup(n));case 4:return t.abrupt("return",s.loginRedirect(n).then(null));case 5:return t.abrupt("return",s.ssoSilent(n));case 6:throw"Invalid interaction type provided.";case 7:case"end":return t.stop()}}),t)})),function(){var e=this,n=arguments;return new Promise((function(r,o){var i=t.apply(e,n);function a(t){h(i,r,o,a,c,"next",t)}function c(t){h(i,r,o,a,c,"throw",t)}a(void 0)}))});return function(t,n){return e.apply(this,arguments)}}(),[s]);return n.useEffect((function(){w||p||l!==e.None||(A(!0),x(t,r).then((function(t){a.current&&E([t,null])})).catch((function(t){a.current&&E([null,t])})))}),[p,l,w,t,r,x]),{login:x,result:m,error:g}}exports.AuthenticatedTemplate=function(t){var e=t.username,o=t.homeAccountId,i=t.localAccountId,a=t.children,s=u();return f(n.useMemo((function(){return{username:e,homeAccountId:o,localAccountId:i}}),[e,o,i]))?r.createElement(r.Fragment,null,c(a,s)):null},exports.MsalAuthenticationTemplate=function(t){var o=t.interactionType,i=t.username,a=t.homeAccountId,s=t.localAccountId,l=t.authenticationRequest,h=t.loadingComponent,p=t.errorComponent,d=t.children,y=n.useMemo((function(){return{username:i,homeAccountId:a,localAccountId:s}}),[i,a,s]),m=u(),g=v(o,l,y),E=f(y);if(g.error){if(p)return r.createElement(r.Fragment,null,c(p,g));throw g.error}return E?r.createElement(r.Fragment,null,c(d,g)):h||m.inProgress!==e.None?r.createElement(r.Fragment,null,c(h,m)):null},exports.MsalConsumer=a,exports.MsalContext=i,exports.MsalProvider=function(t){var a=t.instance,c=t.children,u=n.useState(a.getAllAccounts()),s=u[0],l=u[1],f=n.useState(e.Startup),h=f[0],p=f[1];return n.useEffect((function(){var t=a.addEventCallback((function(t){switch(t.eventType){case o.EventType.LOGIN_START:p(e.Login);break;case o.EventType.SSO_SILENT_START:p(e.SsoSilent);break;case o.EventType.ACQUIRE_TOKEN_START:t.interactionType!==o.InteractionType.Redirect&&t.interactionType!==o.InteractionType.Popup||p(e.AcquireToken);break;case o.EventType.HANDLE_REDIRECT_START:p(e.HandleRedirect);break;case o.EventType.LOGOUT_START:p(e.Logout);break;case o.EventType.LOGIN_SUCCESS:case o.EventType.SSO_SILENT_SUCCESS:case o.EventType.HANDLE_REDIRECT_END:case o.EventType.LOGIN_FAILURE:case o.EventType.SSO_SILENT_FAILURE:case o.EventType.LOGOUT_FAILURE:l(a.getAllAccounts()),p(e.None);break;case o.EventType.ACQUIRE_TOKEN_SUCCESS:case o.EventType.ACQUIRE_TOKEN_FAILURE:l(a.getAllAccounts()),t.interactionType!==o.InteractionType.Redirect&&t.interactionType!==o.InteractionType.Popup||p(e.None)}}));return a.handleRedirectPromise(),function(){t&&a.removeEventCallback(t)}}),[a]),r.createElement(i.Provider,{value:{instance:a,inProgress:h,accounts:s}},c)},exports.UnauthenticatedTemplate=function(t){var e=t.username,o=t.homeAccountId,i=t.localAccountId,a=t.children,s=u();return f(n.useMemo((function(){return{username:e,homeAccountId:o,localAccountId:i}}),[e,o,i]))?null:r.createElement(r.Fragment,null,c(a,s))},exports.useAccount=s,exports.useIsAuthenticated=f,exports.useMsal=u,exports.useMsalAuthentication=v,exports.withMsal=function(t){var e=function(e){var n=u();return r.createElement(t,Object.assign({},e,{msalContext:n}))};return e.displayName="withMsal("+(t.displayName||t.name||"Component")+")",e};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t,n=require("react"),r=(e=n)&&"object"==typeof e&&"default"in e?e.default:e,o=require("@azure/msal-browser");!function(e){e.Startup="startup",e.Login="login",e.Logout="logout",e.AcquireToken="acquireToken",e.SsoSilent="ssoSilent",e.HandleRedirect="handleRedirect",e.None="none"}(t||(t={}));var a=n.createContext({instance:o.stubbedPublicClientApplication,inProgress:t.None,accounts:[]}),c=a.Consumer;function i(e,t){return"function"==typeof e?e(t):e}var u=function(){return n.useContext(a)};function s(e){var t=u(),r=t.instance,o=t.inProgress,a=n.useState(null),c=a[0],i=a[1];return n.useEffect((function(){i(function(e,t){var n=e.getAllAccounts();return n.length>0&&(t.homeAccountId||t.localAccountId||t.username)&&n.filter((function(e){return!(t.username&&t.username.toLowerCase()!==e.username.toLowerCase()||t.homeAccountId&&t.homeAccountId.toLowerCase()!==e.homeAccountId.toLowerCase()||t.localAccountId&&t.localAccountId.toLowerCase()!==e.localAccountId.toLowerCase())}))[0]||null}(r,e))}),[o,e,r]),c}function l(e){var t=u().accounts,r=s(e||{}),o=n.useState(!1),a=o[0],c=o[1];return n.useEffect((function(){c(function(e,t,n){return n&&(n.username||n.homeAccountId||n.localAccountId)?!!t:e.length>0}(t,r,e))}),[t,r,e]),a}function f(e,t,n,r,o,a,c){try{var i=e[a](c),u=i.value}catch(e){return void n(e)}i.done?t(u):Promise.resolve(u).then(r,o)}var h,p=(function(e){var t=function(e){var t=Object.prototype,n=t.hasOwnProperty,r="function"==typeof Symbol?Symbol:{},o=r.iterator||"@@iterator",a=r.asyncIterator||"@@asyncIterator",c=r.toStringTag||"@@toStringTag";function i(e,t,n){return Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}),e[t]}try{i({},"")}catch(e){i=function(e,t,n){return e[t]=n}}function u(e,t,n,r){var o=Object.create((t&&t.prototype instanceof f?t:f).prototype),a=new L(r||[]);return o._invoke=function(e,t,n){var r="suspendedStart";return function(o,a){if("executing"===r)throw new Error("Generator is already running");if("completed"===r){if("throw"===o)throw a;return{value:void 0,done:!0}}for(n.method=o,n.arg=a;;){var c=n.delegate;if(c){var i=T(c,n);if(i){if(i===l)continue;return i}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if("suspendedStart"===r)throw r="completed",n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);r="executing";var u=s(e,t,n);if("normal"===u.type){if(r=n.done?"completed":"suspendedYield",u.arg===l)continue;return{value:u.arg,done:n.done}}"throw"===u.type&&(r="completed",n.method="throw",n.arg=u.arg)}}}(e,n,a),o}function s(e,t,n){try{return{type:"normal",arg:e.call(t,n)}}catch(e){return{type:"throw",arg:e}}}e.wrap=u;var l={};function f(){}function h(){}function p(){}var v={};v[o]=function(){return this};var d=Object.getPrototypeOf,y=d&&d(d(A([])));y&&y!==t&&n.call(y,o)&&(v=y);var E=p.prototype=f.prototype=Object.create(v);function m(e){["next","throw","return"].forEach((function(t){i(e,t,(function(e){return this._invoke(t,e)}))}))}function g(e,t){var r;this._invoke=function(o,a){function c(){return new t((function(r,c){!function r(o,a,c,i){var u=s(e[o],e,a);if("throw"!==u.type){var l=u.arg,f=l.value;return f&&"object"==typeof f&&n.call(f,"__await")?t.resolve(f.__await).then((function(e){r("next",e,c,i)}),(function(e){r("throw",e,c,i)})):t.resolve(f).then((function(e){l.value=e,c(l)}),(function(e){return r("throw",e,c,i)}))}i(u.arg)}(o,a,r,c)}))}return r=r?r.then(c,c):c()}}function T(e,t){var n=e.iterator[t.method];if(void 0===n){if(t.delegate=null,"throw"===t.method){if(e.iterator.return&&(t.method="return",t.arg=void 0,T(e,t),"throw"===t.method))return l;t.method="throw",t.arg=new TypeError("The iterator does not provide a 'throw' method")}return l}var r=s(n,e.iterator,t.arg);if("throw"===r.type)return t.method="throw",t.arg=r.arg,t.delegate=null,l;var o=r.arg;return o?o.done?(t[e.resultName]=o.value,t.next=e.nextLoc,"return"!==t.method&&(t.method="next",t.arg=void 0),t.delegate=null,l):o:(t.method="throw",t.arg=new TypeError("iterator result is not an object"),t.delegate=null,l)}function S(e){var t={tryLoc:e[0]};1 in e&&(t.catchLoc=e[1]),2 in e&&(t.finallyLoc=e[2],t.afterLoc=e[3]),this.tryEntries.push(t)}function I(e){var t=e.completion||{};t.type="normal",delete t.arg,e.completion=t}function L(e){this.tryEntries=[{tryLoc:"root"}],e.forEach(S,this),this.reset(!0)}function A(e){if(e){var t=e[o];if(t)return t.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var r=-1,a=function t(){for(;++r<e.length;)if(n.call(e,r))return t.value=e[r],t.done=!1,t;return t.value=void 0,t.done=!0,t};return a.next=a}}return{next:w}}function w(){return{value:void 0,done:!0}}return h.prototype=E.constructor=p,p.constructor=h,h.displayName=i(p,c,"GeneratorFunction"),e.isGeneratorFunction=function(e){var t="function"==typeof e&&e.constructor;return!!t&&(t===h||"GeneratorFunction"===(t.displayName||t.name))},e.mark=function(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,p):(e.__proto__=p,i(e,c,"GeneratorFunction")),e.prototype=Object.create(E),e},e.awrap=function(e){return{__await:e}},m(g.prototype),g.prototype[a]=function(){return this},e.AsyncIterator=g,e.async=function(t,n,r,o,a){void 0===a&&(a=Promise);var c=new g(u(t,n,r,o),a);return e.isGeneratorFunction(n)?c:c.next().then((function(e){return e.done?e.value:c.next()}))},m(E),i(E,c,"Generator"),E[o]=function(){return this},E.toString=function(){return"[object Generator]"},e.keys=function(e){var t=[];for(var n in e)t.push(n);return t.reverse(),function n(){for(;t.length;){var r=t.pop();if(r in e)return n.value=r,n.done=!1,n}return n.done=!0,n}},e.values=A,L.prototype={constructor:L,reset:function(e){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(I),!e)for(var t in this)"t"===t.charAt(0)&&n.call(this,t)&&!isNaN(+t.slice(1))&&(this[t]=void 0)},stop:function(){this.done=!0;var e=this.tryEntries[0].completion;if("throw"===e.type)throw e.arg;return this.rval},dispatchException:function(e){if(this.done)throw e;var t=this;function r(n,r){return c.type="throw",c.arg=e,t.next=n,r&&(t.method="next",t.arg=void 0),!!r}for(var o=this.tryEntries.length-1;o>=0;--o){var a=this.tryEntries[o],c=a.completion;if("root"===a.tryLoc)return r("end");if(a.tryLoc<=this.prev){var i=n.call(a,"catchLoc"),u=n.call(a,"finallyLoc");if(i&&u){if(this.prev<a.catchLoc)return r(a.catchLoc,!0);if(this.prev<a.finallyLoc)return r(a.finallyLoc)}else if(i){if(this.prev<a.catchLoc)return r(a.catchLoc,!0)}else{if(!u)throw new Error("try statement without catch or finally");if(this.prev<a.finallyLoc)return r(a.finallyLoc)}}}},abrupt:function(e,t){for(var r=this.tryEntries.length-1;r>=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev<o.finallyLoc){var a=o;break}}a&&("break"===e||"continue"===e)&&a.tryLoc<=t&&t<=a.finallyLoc&&(a=null);var c=a?a.completion:{};return c.type=e,c.arg=t,a?(this.method="next",this.next=a.finallyLoc,l):this.complete(c)},complete:function(e,t){if("throw"===e.type)throw e.arg;return"break"===e.type||"continue"===e.type?this.next=e.arg:"return"===e.type?(this.rval=this.arg=e.arg,this.method="return",this.next="end"):"normal"===e.type&&t&&(this.next=t),l},finish:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.finallyLoc===e)return this.complete(n.completion,n.afterLoc),I(n),l}},catch:function(e){for(var t=this.tryEntries.length-1;t>=0;--t){var n=this.tryEntries[t];if(n.tryLoc===e){var r=n.completion;if("throw"===r.type){var o=r.arg;I(n)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(e,t,n){return this.delegate={iterator:A(e),resultName:t,nextLoc:n},"next"===this.method&&(this.arg=void 0),l}},e}(e.exports);try{regeneratorRuntime=t}catch(e){Function("r","regeneratorRuntime = r")(t)}}(h={exports:{}}),h.exports);function v(e,r,a){var c=u(),i=c.instance,s=c.inProgress,h=l(a),v=n.useState([null,null]),d=v[0],y=d[0],E=d[1],m=v[1],g=n.useState(!1),T=g[0],S=g[1],I=n.useCallback(function(){var t,n=(t=p.mark((function t(n,a){var c;return p.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:c=a||r,t.t0=n||e,t.next=t.t0===o.InteractionType.Popup?5:t.t0===o.InteractionType.Redirect?6:t.t0===o.InteractionType.Silent?7:8;break;case 5:return t.abrupt("return",i.loginPopup(c));case 6:return t.abrupt("return",i.loginRedirect(c).then(null));case 7:return t.abrupt("return",i.ssoSilent(c));case 8:throw"Invalid interaction type provided.";case 9:case"end":return t.stop()}}),t)})),function(){var e=this,n=arguments;return new Promise((function(r,o){var a=t.apply(e,n);function c(e){f(a,r,o,c,i,"next",e)}function i(e){f(a,r,o,c,i,"throw",e)}c(void 0)}))});return function(e,t){return n.apply(this,arguments)}}(),[i,e,r]);return n.useEffect((function(){var e=i.addEventCallback((function(e){switch(e.eventType){case o.EventType.LOGIN_SUCCESS:case o.EventType.SSO_SILENT_SUCCESS:e.payload&&m([e.payload,null]);break;case o.EventType.LOGIN_FAILURE:case o.EventType.SSO_SILENT_FAILURE:e.error&&m([null,e.error])}}));return function(){e&&i.removeEventCallback(e)}}),[i]),n.useEffect((function(){T||h||s!==t.None||(S(!0),I().catch((function(){})))}),[h,s,T,I]),{login:I,result:y,error:E}}exports.AuthenticatedTemplate=function(e){var t=e.username,o=e.homeAccountId,a=e.localAccountId,c=e.children,s=u();return l(n.useMemo((function(){return{username:t,homeAccountId:o,localAccountId:a}}),[t,o,a]))?r.createElement(r.Fragment,null,i(c,s)):null},exports.MsalAuthenticationTemplate=function(e){var o=e.interactionType,a=e.username,c=e.homeAccountId,s=e.localAccountId,f=e.authenticationRequest,h=e.loadingComponent,p=e.errorComponent,d=e.children,y=n.useMemo((function(){return{username:a,homeAccountId:c,localAccountId:s}}),[a,c,s]),E=u(),m=v(o,f,y),g=l(y);if(m.error&&E.inProgress===t.None){if(p)return r.createElement(p,Object.assign({},m));throw m.error}return g?r.createElement(r.Fragment,null,i(d,m)):h&&E.inProgress!==t.None?r.createElement(h,Object.assign({},E)):null},exports.MsalConsumer=c,exports.MsalContext=a,exports.MsalProvider=function(e){var c=e.instance,i=e.children,u=n.useState([]),s=u[0],l=u[1],f=n.useState(t.Startup),h=f[0],p=f[1];return n.useEffect((function(){var e=c.addEventCallback((function(e){switch(e.eventType){case o.EventType.LOGIN_SUCCESS:case o.EventType.SSO_SILENT_SUCCESS:case o.EventType.HANDLE_REDIRECT_END:case o.EventType.LOGIN_FAILURE:case o.EventType.SSO_SILENT_FAILURE:case o.EventType.LOGOUT_FAILURE:case o.EventType.ACQUIRE_TOKEN_SUCCESS:case o.EventType.ACQUIRE_TOKEN_FAILURE:var t=c.getAllAccounts();(function(e,t){if(e.length!==t.length)return!1;var n=[].concat(t);return e.every((function(e){var t=n.shift();return!(!e||!t)&&e.homeAccountId===t.homeAccountId&&e.localAccountId===t.localAccountId&&e.username===t.username}))})(t,s)||l(t)}}));return function(){e&&c.removeEventCallback(e)}}),[c,s]),n.useEffect((function(){var e=c.addEventCallback((function(e){switch(e.eventType){case o.EventType.LOGIN_START:p(t.Login);break;case o.EventType.SSO_SILENT_START:p(t.SsoSilent);break;case o.EventType.ACQUIRE_TOKEN_START:e.interactionType!==o.InteractionType.Redirect&&e.interactionType!==o.InteractionType.Popup||p(t.AcquireToken);break;case o.EventType.HANDLE_REDIRECT_START:p(t.HandleRedirect);break;case o.EventType.LOGOUT_START:p(t.Logout);break;case o.EventType.LOGIN_SUCCESS:case o.EventType.SSO_SILENT_SUCCESS:case o.EventType.HANDLE_REDIRECT_END:case o.EventType.LOGIN_FAILURE:case o.EventType.SSO_SILENT_FAILURE:case o.EventType.LOGOUT_FAILURE:p(t.None);break;case o.EventType.ACQUIRE_TOKEN_SUCCESS:case o.EventType.ACQUIRE_TOKEN_FAILURE:e.interactionType!==o.InteractionType.Redirect&&e.interactionType!==o.InteractionType.Popup||p(t.None)}}));return c.handleRedirectPromise().catch((function(){})),function(){e&&c.removeEventCallback(e)}}),[c]),r.createElement(a.Provider,{value:{instance:c,inProgress:h,accounts:s}},i)},exports.UnauthenticatedTemplate=function(e){var t=e.username,o=e.homeAccountId,a=e.localAccountId,c=e.children,s=u();return l(n.useMemo((function(){return{username:t,homeAccountId:o,localAccountId:a}}),[t,o,a]))?null:r.createElement(r.Fragment,null,i(c,s))},exports.useAccount=s,exports.useIsAuthenticated=l,exports.useMsal=u,exports.useMsalAuthentication=v,exports.withMsal=function(e){var t=function(t){var n=u();return r.createElement(e,Object.assign({},t,{msalContext:n}))};return t.displayName="withMsal("+(e.displayName||e.name||"Component")+")",t};
 //# sourceMappingURL=msal-react.cjs.production.min.js.map

dist/msal-react.esm.js

@@ -1,2 +0,2 @@
-import React__default, { createContext, useState, useEffect, useContext, useMemo, useRef, useCallback } from 'react';
+import React__default, { createContext, useState, useEffect, useContext, useMemo, useCallback } from 'react';
 import { stubbedPublicClientApplication, EventType, InteractionType } from '@azure/msal-browser';
@@ -41,2 +41,37 @@
  */
+function getChildrenOrFunction(children, args) {
+  if (typeof children === "function") {
+    return children(args);
+  }
+
+  return children;
+}
+/**
+ * Helper function to determine whether 2 arrays are equal
+ * Used to avoid unnecessary state updates
+ * @param arrayA
+ * @param arrayB
+ */
+
+function accountArraysAreEqual(arrayA, arrayB) {
+  if (arrayA.length !== arrayB.length) {
+    return false;
+  }
+
+  var comparisonArray = [].concat(arrayB);
+  return arrayA.every(function (elementA) {
+    var elementB = comparisonArray.shift();
+
+    if (!elementA || !elementB) {
+      return false;
+    }
+
+    return elementA.homeAccountId === elementB.homeAccountId && elementA.localAccountId === elementB.localAccountId && elementA.username === elementB.username;
+  });
+}
+
+/*
+ * Copyright (c) Microsoft Corporation. All rights reserved.
+ * Licensed under the MIT License.
+ */
 function MsalProvider(_ref) {
@@ -47,3 +82,3 @@ var instance = _ref.instance,
   // State hook to store accounts
-  var _useState = useState(instance.getAllAccounts()),
+  var _useState = useState([]),
       accounts = _useState[0],
@@ -60,2 +95,29 @@ setAccounts = _useState[1]; // State hook to store in progress value
       switch (message.eventType) {
+        case EventType.LOGIN_SUCCESS:
+        case EventType.SSO_SILENT_SUCCESS:
+        case EventType.HANDLE_REDIRECT_END:
+        case EventType.LOGIN_FAILURE:
+        case EventType.SSO_SILENT_FAILURE:
+        case EventType.LOGOUT_FAILURE:
+        case EventType.ACQUIRE_TOKEN_SUCCESS:
+        case EventType.ACQUIRE_TOKEN_FAILURE:
+          var currentAccounts = instance.getAllAccounts();
+
+          if (!accountArraysAreEqual(currentAccounts, accounts)) {
+            setAccounts(currentAccounts);
+          }
+
+          break;
+      }
+    });
+    return function () {
+      // Remove callback when component unmounts or accounts change
+      if (callbackId) {
+        instance.removeEventCallback(callbackId);
+      }
+    };
+  }, [instance, accounts]);
+  useEffect(function () {
+    var callbackId = instance.addEventCallback(function (message) {
+      switch (message.eventType) {
         case EventType.LOGIN_START:
@@ -90,3 +152,2 @@ setInProgress(InteractionStatus.Login);
         case EventType.LOGOUT_FAILURE:
-          setAccounts(instance.getAllAccounts());
           setInProgress(InteractionStatus.None);
@@ -97,4 +158,2 @@ break;
         case EventType.ACQUIRE_TOKEN_FAILURE:
-          setAccounts(instance.getAllAccounts());
-
           if (message.interactionType === InteractionType.Redirect || message.interactionType === InteractionType.Popup) {
@@ -107,8 +166,12 @@ setInProgress(InteractionStatus.None);
     });
-    instance.handleRedirectPromise();
+    instance.handleRedirectPromise()["catch"](function () {
+      // Errors should be handled by listening to the LOGIN_FAILURE event
+      return;
+    });
     return function () {
-      callbackId && instance.removeEventCallback(callbackId);
+      if (callbackId) {
+        instance.removeEventCallback(callbackId);
+      }
     };
-  }, [instance]); // Memoized context value
-
+  }, [instance]);
   var contextValue = {
@@ -128,14 +191,2 @@ instance: instance,
  */
-function getChildrenOrFunction(children, args) {
-  if (typeof children === "function") {
-    return children(args);
-  }
-
-  return children;
-}
-
-/*
- * Copyright (c) Microsoft Corporation. All rights reserved.
- * Licensed under the MIT License.
- */
 var useMsal = function useMsal() {
@@ -151,11 +202,24 @@ return useContext(MsalContext);
 function getAccount(instance, accountIdentifiers) {
-  if (accountIdentifiers.localAccountId) {
-    return instance.getAccountByLocalId(accountIdentifiers.localAccountId);
-  } else if (accountIdentifiers.homeAccountId) {
-    return instance.getAccountByHomeId(accountIdentifiers.homeAccountId);
-  } else if (accountIdentifiers.username) {
-    return instance.getAccountByUsername(accountIdentifiers.username);
+  var allAccounts = instance.getAllAccounts();
+
+  if (allAccounts.length > 0 && (accountIdentifiers.homeAccountId || accountIdentifiers.localAccountId || accountIdentifiers.username)) {
+    var matchedAccounts = allAccounts.filter(function (accountObj) {
+      if (accountIdentifiers.username && accountIdentifiers.username.toLowerCase() !== accountObj.username.toLowerCase()) {
+        return false;
+      }
+
+      if (accountIdentifiers.homeAccountId && accountIdentifiers.homeAccountId.toLowerCase() !== accountObj.homeAccountId.toLowerCase()) {
+        return false;
+      }
+
+      if (accountIdentifiers.localAccountId && accountIdentifiers.localAccountId.toLowerCase() !== accountObj.localAccountId.toLowerCase()) {
+        return false;
+      }
+
+      return true;
+    });
+    return matchedAccounts[0] || null;
+  } else {
+    return null;
   }
-
-  return null;
 }
@@ -183,4 +247,4 @@
 
-function isAuthenticated(allAccounts, account, accountIdentifiers) {
-  if (accountIdentifiers && (accountIdentifiers.username || accountIdentifiers.homeAccountId || accountIdentifiers.localAccountId)) {
+function isAuthenticated(allAccounts, account, matchAccount) {
+  if (matchAccount && (matchAccount.username || matchAccount.homeAccountId || matchAccount.localAccountId)) {
     return !!account;
@@ -192,9 +256,9 @@ }
 
-function useIsAuthenticated(accountIdentifiers) {
+function useIsAuthenticated(matchAccount) {
   var _useMsal = useMsal(),
       allAccounts = _useMsal.accounts;
 
-  var account = useAccount(accountIdentifiers || {});
+  var account = useAccount(matchAccount || {});
 
-  var _useState = useState(isAuthenticated(allAccounts, account, accountIdentifiers)),
+  var _useState = useState(false),
       hasAuthenticated = _useState[0],
@@ -204,4 +268,4 @@ setHasAuthenticated = _useState[1];
   useEffect(function () {
-    setHasAuthenticated(isAuthenticated(allAccounts, account, accountIdentifiers));
-  }, [allAccounts, account, accountIdentifiers]);
+    setHasAuthenticated(isAuthenticated(allAccounts, account, matchAccount));
+  }, [allAccounts, account, matchAccount]);
   return hasAuthenticated;
@@ -1062,10 +1126,3 @@ }
 
-function useMsalAuthentication(interactionType, authenticationRequest, accountIdentifier) {
-  var isMounted = useRef(true);
-  useEffect(function () {
-    return function () {
-      isMounted.current = false;
-    };
-  }, []);
-
+function useMsalAuthentication(interactionType, authenticationRequest, accountIdentifiers) {
   var _useMsal = useMsal(),
@@ -1075,3 +1132,3 @@ instance = _useMsal.instance,
 
-  var isAuthenticated = useIsAuthenticated(accountIdentifier);
+  var isAuthenticated = useIsAuthenticated(accountIdentifiers);
 
@@ -1089,3 +1146,4 @@ var _useState = useState([null, null]),
   var login = useCallback( /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(loginType, request) {
+    var _ref = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee(callbackInteractionType, callbackRequest) {
+      var loginType, loginRequest;
       return runtime_1.wrap(function _callee$(_context) {
@@ -1095,19 +1153,21 @@ while (1) {
             case 0:
+              loginType = callbackInteractionType || interactionType;
+              loginRequest = callbackRequest || authenticationRequest;
               _context.t0 = loginType;
-              _context.next = _context.t0 === InteractionType.Popup ? 3 : _context.t0 === InteractionType.Redirect ? 4 : _context.t0 === InteractionType.Silent ? 5 : 6;
+              _context.next = _context.t0 === InteractionType.Popup ? 5 : _context.t0 === InteractionType.Redirect ? 6 : _context.t0 === InteractionType.Silent ? 7 : 8;
               break;
 
-            case 3:
-              return _context.abrupt("return", instance.loginPopup(request));
+            case 5:
+              return _context.abrupt("return", instance.loginPopup(loginRequest));
 
-            case 4:
-              return _context.abrupt("return", instance.loginRedirect(request).then(null));
+            case 6:
+              return _context.abrupt("return", instance.loginRedirect(loginRequest).then(null));
 
-            case 5:
-              return _context.abrupt("return", instance.ssoSilent(request));
+            case 7:
+              return _context.abrupt("return", instance.ssoSilent(loginRequest));
 
-            case 6:
+            case 8:
               throw "Invalid interaction type provided.";
 
-            case 7:
+            case 9:
             case "end":
@@ -1123,14 +1183,39 @@ return _context.stop();
     };
-  }(), [instance]);
+  }(), [instance, interactionType, authenticationRequest]);
   useEffect(function () {
+    var callbackId = instance.addEventCallback(function (message) {
+      switch (message.eventType) {
+        case EventType.LOGIN_SUCCESS:
+        case EventType.SSO_SILENT_SUCCESS:
+          if (message.payload) {
+            setResponse([message.payload, null]);
+          }
+
+          break;
+
+        case EventType.LOGIN_FAILURE:
+        case EventType.SSO_SILENT_FAILURE:
+          if (message.error) {
+            setResponse([null, message.error]);
+          }
+
+          break;
+      }
+    });
+    return function () {
+      if (callbackId) {
+        instance.removeEventCallback(callbackId);
+      }
+    };
+  }, [instance]);
+  useEffect(function () {
     if (!hasBeenCalled && !isAuthenticated && inProgress === InteractionStatus.None) {
       // Ensure login is only called one time from within this hook, any subsequent login attempts should use the callback returned
       setHasBeenCalled(true);
-      login(interactionType, authenticationRequest).then(function (result) {
-        isMounted.current && setResponse([result, null]);
-      })["catch"](function (error) {
-        isMounted.current && setResponse([null, error]);
+      login()["catch"](function () {
+        // Errors are handled by the event handler above
+        return;
       });
     }
-  }, [isAuthenticated, inProgress, hasBeenCalled, interactionType, authenticationRequest, login]);
+  }, [isAuthenticated, inProgress, hasBeenCalled, login]);
   return {
@@ -1158,4 +1243,4 @@ login: login,
       authenticationRequest = _ref.authenticationRequest,
-      loadingComponent = _ref.loadingComponent,
-      errorComponent = _ref.errorComponent,
+      LoadingComponent = _ref.loadingComponent,
+      ErrorComponent = _ref.errorComponent,
       children = _ref.children;
@@ -1173,5 +1258,5 @@ var accountIdentifier = useMemo(function () {
 
-  if (msalAuthResult.error) {
-    if (!!errorComponent) {
-      return React__default.createElement(React__default.Fragment, null, getChildrenOrFunction(errorComponent, msalAuthResult));
+  if (msalAuthResult.error && context.inProgress === InteractionStatus.None) {
+    if (!!ErrorComponent) {
+      return React__default.createElement(ErrorComponent, Object.assign({}, msalAuthResult));
     }
@@ -1186,4 +1271,4 @@
 
-  if (!!loadingComponent || context.inProgress !== InteractionStatus.None) {
-    return React__default.createElement(React__default.Fragment, null, getChildrenOrFunction(loadingComponent, context));
+  if (!!LoadingComponent && context.inProgress !== InteractionStatus.None) {
+    return React__default.createElement(LoadingComponent, Object.assign({}, context));
   }
@@ -1190,0 +1275,0 @@

dist/MsalContext.d.ts

 import * as React from "react";
-import { IPublicClientApplication, AccountInfo } from "@azure/msal-browser";
+import { IPublicClientApplication } from "@azure/msal-browser";
 import { InteractionStatus } from "./utils/Constants";
+import { AccountIdentifiers } from "./types/AccountIdentifiers";
 export interface IMsalContext {
     instance: IPublicClientApplication;
     inProgress: InteractionStatus;
-    accounts: AccountInfo[];
+    accounts: AccountIdentifiers[];
 }
 export declare const MsalContext: React.Context<IMsalContext>;
 export declare const MsalConsumer: React.Consumer<IMsalContext>;

dist/utils/utilities.d.ts

 /// <reference types="react" />
+import { AccountIdentifiers } from "../types/AccountIdentifiers";
 declare type FaaCFunction = <T>(args: T) => React.ReactNode;
@@ -7,2 +8,9 @@ export declare function getChildrenOrFunction<T>(children: React.ReactNode | FaaCFunction, args: T): React.ReactNode;
 export declare type Subtract<T extends T1, T1 extends object> = Pick<T, SetComplement<keyof T, keyof T1>>;
+/**
+ * Helper function to determine whether 2 arrays are equal
+ * Used to avoid unnecessary state updates
+ * @param arrayA
+ * @param arrayB
+ */
+export declare function accountArraysAreEqual(arrayA: Array<AccountIdentifiers>, arrayB: Array<AccountIdentifiers>): boolean;
 export {};

package.json

 {
   "name": "@azure/msal-react",
-  "version": "1.0.0-alpha.0",
+  "version": "1.0.0-alpha.1",
   "author": {
@@ -40,3 +40,3 @@ "name": "Microsoft",
   "peerDependencies": {
-    "@azure/msal-browser": "^2.7.0",
+    "@azure/msal-browser": "^2.8.0",
     "react": "^16.13.0 || ^17"
@@ -46,3 +46,3 @@ },
   "devDependencies": {
-    "@azure/msal-browser": "^2.7.0",
+    "@azure/msal-browser": "^2.8.0",
     "@babel/core": "^7.10.5",
@@ -49,0 +49,0 @@ "@storybook/addon-actions": "^5.3.19",

README.md

 # Microsoft Authentication Library for React (msal-react)
 
+[![npm version](https://img.shields.io/npm/v/@azure/msal-react.svg?style=flat)](https://www.npmjs.com/package/@azure/msal-react/)[![npm version](https://img.shields.io/npm/dm/@azure/msal-react.svg)](https://nodei.co/npm/@azure/msal-react/)
+
 `msal-react` is under development. **We do not recommend using this in a production environment yet**.
@@ -48,3 +50,3 @@
 
-### Building the package
+### Building the package locally
 
@@ -54,2 +56,4 @@ To build the `@azure/msal-react` library, you can do the following:
 ```bash
+// Install dev dependencies from root of repo
+npm install
 // Change to the msal-react package directory
@@ -64,2 +68,4 @@ cd lib/msal-react/
 ```bash
+// Install dev dependencies from root of repo
+npm install
 // Change to the msal-react package directory
@@ -66,0 +72,0 @@ cd lib/msal-react/

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

334899

increased by8%

Number of package files

25

increased by4.17%

Lines of code

2449

increased by9.82%

Number of lines in readme file

121

increased by5.22%

No dependency changes