In the React SDK, isLoggedIn set to false on first token expiry and never back to true after a successful refresh [reopened]

[sachams]

In the React SDK, isLoggedIn set to false on first token expiry and never back to true after a successful refresh [reopened]

Description

This is a reopening of this issue, which still persists after upgrading to v2.4.2 of the SDK.

Affects package

react-sdk

Affects versions

"@fusionauth/react-sdk@npm:^2.4.2":
  version: 2.4.2
  resolution: "@fusionauth/react-sdk@npm:2.4.2"
  dependencies:
    classnames: "npm:^2.3.2"
  peerDependencies:
    react: ">=18.2.0"
    react-dom: ">=18.2.0"
  checksum: 10c0/5eae2a0def35e01b8dbd8379e0dd5a7d1218a1686b53e83b2c90b8f07c24f33f12dc519c24a4a75a67f9890b2ff96689d1de2b532ec1c3f261f2525e56b6f42d
  languageName: node
  linkType: hard

Steps to reproduce

Steps to reproduce the behavior:
Add logging like this into App, and set the JWT token expiry to 10s

  console.log("App: isLoggedIn", isLoggedIn, " isFetchingUserInfo", isFetchingUserInfo)

After the token expires, isLoggedIn gets set to false and never gets set back to true.

Expected behavior

It is expected that isLoggedIn gets set back to true when the token is refreshed.

Screenshots

isLoggedIn.mp4

Platform

(Please complete the following information)

• Device: Desktop
• OS: macOs
• Chrome Version 128.0.6613.138 (Official Build) (arm64)

Community guidelines

All issues filed in this repository must abide by the FusionAuth community guidelines.

[MaxDNG]

The cause might be similar to an issue I had with React.StrictMode (see #168).

Do you have the same issue without StrictMode (assuming you are using it)? If not, did you try increasing the autoRefreshSecondsBeforeExpiry value? It might be that the refresh call takes too long and completes after the tokenExpirationTimeout ends.

That being said, if the refresh does work, it should indeed call the setIsLoggedIn method, through a config onAutoRefreshSuccess for example.

As a matter of fact, as pointed out by @johnmccalla in the other issue, there is clearly a problem with the config being destructured and used as a dependency in the useMemo. This triggers unnecessary re-creation of the SDKCore. Plus if the SDKCore is recreated, then the loggedIn state should probably be recomputed from the new SDKCore instance (as it stand, it's only ever set to true potentially on mount).

I'll try to open a PR for this.

[vamsichundi]

@sachams I am also facing the same, application is logging out after performing autorefresh. then it is redirecting to/loginwhere isLoggedIn is set to false. How can we set it to true or redirect to success url ? is there any hook or doc that we can fix this issue

@MaxDNG any thoughts on this i didnt find onAutoRefreshSuccess hook config any where from config or context provider

[johnmccalla]

I wasn't fast enough to comment in the other issue (my bad) before it got closed, but I decided to write my own logic, the sdk is just too complex. (Another problem I was having is with the long timeouts on some mobile devices not behaving properly after suspend/sleep resumes.)

My own implementation is pretty simple:
(1) Exposes 3 states: isLoggedIn (false initially), isUserInfoPending (true initially), isTokenRefreshingPending (true initially, this allows the app to wait until the initial state is "settled")
(1) Refresh token on startup if current access token is expired
(2) Check for token expiry every minute, and if happening "soon", refresh, and if it fails, user is logged out
(3) Fetch the user info anytime isLoggedIn changes.

This makes it very easy for downstream components to understand what's happening and decide what screens to put up.

[JakeLo123]

Here's a PR

There was a prior bug fix for this issue -- see changes for 2.1.1. I installed that version and the bug doesn't produce, so it must've regressed at some point between then and now.

In any case, I hope that helps! Between that and this nice PR from @MaxDNG it should clean up some of the issues with timeout/callback syncing.

[alex-fusionauth]

Thanks once again @JakeLo123!

The latest has been released
https://www.npmjs.com/package/@fusionauth/react-sdk/v/2.4.3

If anyone sees issues, I can reopen it.

[sachams]

Hey all thanks for the comments and @JakeLo123 @alex-fusionauth thanks for the fix! I have just tested it and it is looking good so far! 🙌