When refreshing the page account is undefined in react

Technical Issue Reporting
#4

are you using like the latest version of moralis and react-moralis?

#5

“moralis”: “^0.0.184”,
“react-moralis”: “^0.3.11”,

I had other bugs with the latest version using etherjs. So @cryptokid advised me to use the last stable version.

#6

this is from current user object, not from what is in metamask, so it will not get updated when wallet is switched

#7

Ohhh I see, not aware of this issue, also yeah if you use user.get("ethAddress") the reason why it doesn’t change automatically is because it fetches from DB instead of detecting it locally

#8

@cryptokid @YosephKS I know all of what you’re saying. My question is: why sometimes when I refresh my app, the account value is set to null and never updated again?

#9

maybe it was not updated yet when it tried to display it, how do you display it?

#10

I am using this code inside custom hook:

  useEffect(() => {
    if (!account) return;

   // Do something
  }, [account]);

This code is never run because account is always null and never updated

#11

how do you initialize the account on refresh?

#12

Only const {account} = useMoralis();

It should work no?

#13

I don’t know, https://github.com/MoralisWeb3/react-moralis#usemoralis

there seem to be a lot of values from useMoralis, like isInitialized, isInitializing, user, enableWeb3, account, isWeb3Enabled

#14

a lot of value yes but it would better if it’s actually working

#15

maybe you need to use enableWeb3, check isInitialized, or isWeb3Enabled

#16

Here what I am doing:

App.tsx

  const { isInitialized, Moralis } = useMoralis();

  useEffect(() => {
    Moralis.Web3.enableWeb3();
  }, [Moralis]);

  if (!isInitialized) {
    return <Loader />;
  }

return <Component />

Component.tsx

 useEffect(() => {
    if (!isAuthenticated) return;
    if (!account) return;

    // DO STUFF
  }, [account, isAuthenticated]);

I am always getting an empty account value with null

#17

if you use console.log(account) on a button, it works?

#18

why with a button? I have tried an it is the same

#19

and btw, isWeb3Enabled is always false, even after calling Moralis.Web3.enableWeb3();

#20

maybe that is why account is also undefined, if web3 is not enabled

#21

So there is a bug because isWeb3Enabled is always false

#22

try something like that, worked for me:

const { isInitialized, account} = useMoralis();

useEffect(() => {
    if (isInitialized && account) {
        **YOUR CODE HERE**
    }
  }, [isInitialized, account]);
2 Likes
#23

I’m having this same issue with react and useMoralis. Every time I refresh the page, the user object is still valid but the account and chainId go back to null. I can get the account by digging into the user object like user.attributes.ethAddress, but the fact that “account” disappears on refresh seems like an important bug and it messes up a lot of logic in my app. Any solutions yet?

By the way, it does work to refresh the useMoralis account object by putting Moralis.enableWeb3() in useEffect, but that also throws another error:

Cannot execute Moralis.enableWeb3(), as Moralis Moralis.enableWeb3() already has been called, but is not finished yet