fix: state update on an unmounted component (#522)

bjerkio · Mar 9, 2021 · 0e873f4 · 0e873f4
1 parent 3ea01a9
commit 0e873f4
Showing 1 changed file with 12 additions and 5 deletions.
diff --git a/src/AuthContext.tsx b/src/AuthContext.tsx
@@ -1,4 +1,4 @@
-import React, { FC, useState, useEffect } from 'react';
+import React, { FC, useState, useEffect, useRef } from 'react';
 import { UserManager, User } from 'oidc-client';
 import {
   Location,
@@ -46,7 +46,7 @@ export const initUserManager = (props: AuthProviderProps): UserManager => {
     loadUserInfo,
     popupWindowFeatures,
     popupRedirectUri,
-    popupWindowTarget
+    popupWindowTarget,
   } = props;
   return new UserManager({
     authority,
@@ -57,7 +57,7 @@ export const initUserManager = (props: AuthProviderProps): UserManager => {
     post_logout_redirect_uri: postLogoutRedirectUri || redirectUri,
     response_type: responseType || 'code',
     scope: scope || 'openid',
-    loadUserInfo: loadUserInfo != undefined? loadUserInfo : true,
+    loadUserInfo: loadUserInfo != undefined ? loadUserInfo : true,
     popupWindowFeatures: popupWindowFeatures,
     popup_redirect_uri: popupRedirectUri,
     popupWindowTarget: popupWindowTarget,
@@ -93,6 +93,13 @@ export const AuthProvider: FC<AuthProviderProps> = ({
     await userManager.signinPopupCallback();
   };
 
+  const isMountedRef = useRef(true);
+  useEffect(() => {
+    return () => {
+      isMountedRef.current = false;
+    };
+  }, []);
+
   useEffect(() => {
     const getUser = async (): Promise<void> => {
       /**
@@ -110,7 +117,7 @@ export const AuthProvider: FC<AuthProviderProps> = ({
         onBeforeSignIn && onBeforeSignIn();
         userManager.signinRedirect();
       } else {
-        setUserData(user);
+        isMountedRef.current && setUserData(user);
       }
       return;
     };
@@ -121,7 +128,7 @@ export const AuthProvider: FC<AuthProviderProps> = ({
     // for refreshing react state when new state is available in e.g. session storage
     const updateUserData = async () => {
       const user = await userManager.getUser();
-      setUserData(user);
+      isMountedRef.current && setUserData(user);
     };
 
     userManager.events.addUserLoaded(updateUserData);