isLoggedIn incorrect after periods of inactivity

[sachams]

isLoggedIn incorrect after periods of inactivity

Description

After the fix in #166 I thought the issue with isLoggedIn not being updated correctly were resolved. However, I still find cases where isLoggedIn is incorrectly set to false.

Affects package

react-sdk

Affects versions

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

Steps to reproduce

Note that this doesn't always reproduce the behaviour unfortunately. Sometimes the steps below trigger it, sometimes not.

1. Add logging like this into App, and set the JWT token expiry to 15s

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

2. Change to another tab in the browser (so the application tab is not visible)
3. Wait 30s
4. Go back to the application tab
5. isLoggedOut is false 💣

Expected behavior

The isLoggedIn flag is true - all the refresh calls succeeded and so the user should remain logged in.

Platform

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

Community guidelines

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

[sachams]

@JakeLo123 @alex-fusionauth have you noticed any similar problems with isLoggedIn in the latest verison?

[JakeLo123]

Can't say I have, although I've not used the package on a regular basis since the last version.

[sachams]

OK cool, thanks anyway! @alex-fusionauth have you seen this issue before?

[alex-fusionauth]

I feel like diving into this further it seems to me there is an issue here where isLoggedIn is comparing a value that has already been manipulated by getAccessTokenExpirationMoment that calls toMilliseconds on the value.

So essentially I think we are calling something where things are milliseconds to non-milliseconds.

fusionauth-javascript-sdk/packages/core/src/SDKCore/SDKCore.ts

Line 130 in 1b5643c

return this.at_exp > new Date().getTime();

[alex-fusionauth]

I have tried this locally and it works as I would expect.

  get isLoggedIn() {
    return new Date(this.at_exp) > new Date();
  }

Unfortunately when testing this in Next.js I am getting this error

Can't perform a React state update on a component that hasn't mounted yet. This indicates that you have a side-effect in your render function that asynchronously later calls tries to update the component. Move this work to useEffect instead.

Which is thrown from here

  const core: SDKCore = useMemo<SDKCore>(() => {
    if (coreRef.current) {
      coreRef.current.dispose();
    }

    const newCore = new SDKCore({
      ...config,
      cookieAdapter,
      onTokenExpiration: () => setIsLoggedIn(false),
    });
    coreRef.current = newCore;
    return newCore;
  }, [config, cookieAdapter]);

I will need to grab a real React expert on this error to hopefully resolve.