useAuthState inconsistent persistence

I’m not too sure what is going on but I have two components in my app that use the useAuthState hook.

const  = ({ calloutText }) => {
  const [user, loading] = useAuthState(firebase.auth());

  console.log('WelcomeOrCallout', user);

  if (user) {
    return (
      <span className="button" style={{ display: 'inline-block' }}>
        👋 Welcome back
      </span>
    );
  }

  if (loading) {
    return <Spinner />;
  }

  return <Callout text={calloutText} href={'signup'} />;
};

and

export const Links = ({ routes }) => {
  const [user, loading] = useAuthState(firebase.auth());

  console.log('Links', user);

  if (loading) {
    return null;
  }

  if (user) {
    return <UserMenu user={user} />;
  }

  return routes.map(
    ({ path, name, url, shouldHideFromNav, requiresAuth }, i) => {
      if (shouldHideFromNav) {
        return null;
      }

      if (requiresAuth && !user) {
        return null;
      }

      return (
        <>
          <li key={i}>
            <NavLink href={path} name={name} url={url} />
          </li>
          <li className="has-button">
            <Callout className="small" text={'Sign up'} />
          </li>
        </>
      );
    }
  );
};

Now, here is the weird thing, when I use useAuthState in WelcomeOrCallout, even after signing out, Links returns a user from the hook while WelcomeOrCallout does not.

If I do NOT use useAuthState in WelcomeOrCallout, Links works as expected, not rendering the UserMenu.

Is there anything I am doing wrong here that could cause this to happen? Scratching my head honestly.

Here’s my sign out page code (this is a next-js app)

export default () => {
  firebase.auth().signOut();

  return (
    <Page>
      <Content loading />
      <Redirect route="/" />
    </Page>
  );
};

Note: What’s also interesting is that if I log firebase.auth() in both components, after signing out the currentUser value is null. So it seems that the sign out is working on the firebase client end, but the hook isn’t updating correctly?

[nickroberts]

The hook fires when logging out, so it does trigger. I guess I’ll have to figure out a way to handle updating the user profile. It’s not a deal breaker, but it’s just a bit odd. 😄

[klutchdev]

are y’all still having an issue?? I have a fairly large sized ecommerce app that uses this in multiple components, along with it’s back office counterpart that uses it at the top level with context. Both apps operate properly without any notable difference and update in real time when auth is updated